Увод у Цхеатсхеет ЈКуери
Јкуери је јавасцрипт библиотека за више платформи која је истрајна на примарној намери да олакша веб шифрирање. Доказана је тврдња да је увођење Јкуери-а прилично смањило дужину јавасцрипт кодова. Тако да се чак и мали линијски ЈаваСцрипт код може лако постићи малим блоком или чак једним редом изјаве ЈКуери.
У овом чланку Цхеатсхеет ЈКуери расправљат ћемо о томе што је Јкуери и ПТП овог оквира:
На Интернету постоје бројне веб странице које су активне, а тржиште укључује широк спектар језика који омогућују изградњу ових веб страница и мрежних производа. Неке од познатих су следеће:
- ХТМЛ, ЦСС
- Јавасцрипт и ЈКуери за скриптирање клијента
- ПХП за скрипту на крају сервера
- МИСКЛ за испитивање базе података
- итд.
Предности употребе ЈКуери оквира у односу на друге,
- То укључује огромну заједницу и пуно додатака који су уведени у њу.
- Лагана
- снажне могућности повезивања
- Кратка документација и туторијали
- Способност лаког развоја компоненти Ајак-а
- Могућност је да се код учини једноставним и вишекратним за употребу
- Пријатељски према прегледачу
Основни садржај и синтакса Цхеат Схеет-а ЈКуери:
Укључи: Укључивање Јкуери у тренутну скрипту за извршавање
Синтакса: Синтаксуална структура ЈКуери-а
Селектор одабире ХТМЛ компоненте
$(Selector).action()
Радња изведена на одабраној компоненти
Дефинише употребу ЈКуери-а
Превара за Јкуери Селецторс:
елементи елементаелементи елементаСелектор | ОПИС |
$ ("*") | Бира све ХТМЛ елементе |
$ („П.демо“) | Одабире
елементи елемента |
$ („: Дугме“) | Бира дугме и елементе за унос |
$ ("Тр: чак") | Бира парно |
$ („Тр: непаран“) | Бира непар |
$ ("Распон: родитељ") | Бира елементе који имају придружени подређени елемент |
$ ("(Хреф)") | Бира све елементе са атрибутима хреф |
$ („: Улаз“) | Одабире све елементе облика |
Превара за Јкуери догађаје: Догађај је нека врста акције на веб страници, а кључни догађаји су следећи.
Моусе Евентс | Моусе Евент метод | Догађаји на тастатури | Начин догађаја на тастатури | Форм догађаја | Метода форме форме |
уђите мишем | .моусеентер () | притисак дугмета | .притисак дугмета() | промена | .цханге () |
Дупли клик | .дблцлицк () | Кеидовн | .кеидовн () | фокус | .фоцус () |
кликни | .цлицк () | Кеиуп | .кеиуп () | замагљивање | .блур () |
оставите миша | .моуселеаве () | Догађаји прегледача | Метода претраживача | Доцумент Евентс | Методе догађаја документа |
миш доле | .моуседовн () | Грешка у популацији | .еррор () | истоварити | .унлоад () |
миш горе | .моусеуп () | свитак | .свитак() | учитавање | .лоад () |
Нпр:
$("p").dblclick(function()(
$(this).hide();
));
Цхекуе схеет Јкуери ефекти:
Основе: .хиде (), .схов (), .тоггле () - Омогућује сакривање, приказивање и пребацивање одабраних елемената.
Нпр:
$("p").hide();
Прилагођени: .анимате (), .делаи (), .декуеуе (), .стоп ()
- метода анимате () припрема прилагођене анимације
- метода делаи () омогућава одложено извршење ставки.
- декуеуе () извршава следећи низ функција присутних у реду чекања.
Нпр:
$("element1").animate(
(
opacity : 0.50
left: "+=27"
)
Фаде: фадеТо (), фадеОут (), фадеИн (), фадеТоггле ()
- фадеИн () Избледи скривени елемент
- фадеоут () омогућава бледање видљивог елемента
- фадеТо () бледи до одређене непрозирности
- фадеТоггле () омогућава да се елемент пребаци са методама фаде и бледе.
Нпр:
$("button").click(function()
(
$("#div2").fadeOut("slow");
));
Слиде: слидеДовн (), слидеУп (), слидеТоггле ()
- слидеДовн () Екран са клизним покретима који се преклапају
- слидеТоггле () Приказује или скрива клизним покретима преклапајуће елементе
- слидеУп () Сакрива се клизним покретима који се преклапају
Бесплатни савети и трикови за коришћење Цхеат схеет-а јКуери
1) Задржите контекстни параметар који омогућава да се извршавање покрене из дубље гране ДОМ-а уместо да се позива из корена.
2) Проверите да ли елемент постоји, а затим гурните напред за извршење кода.
Синтакса:
if($("#element").length)
(
// DOM element exists
)
else
(
//DOM element dont exists
)
3) Метода података јКуерис веже ДОМ елементе и податке без модификације ДОМ-а.
4) Проверите да ли је било који од елемената сакривен.
Нпр:
if($(element).is(":visible") == "true")
(
//The element is Visible
)
5) Водите рачуна о непосредним претходним елементима детета.
6) Учитавање слика пре оптимизира перформансе извршења упита.
7) Боље је проверити да ли је захтев успешно учитан пре него што га извршите.
Нпр:
if (typeof jQuery == 'undefined')
(
console.log('jQuery not loaded');
)
else
(
console.log('jQuery loaded');
)
8) Прекинуте везе слике могу се лако заменити спровођењем доњег дела кода,
Нпр:
$('img').on('error', function ()
(
if(!$(this).hasClass('broken-image'))
(
$(this).prop('src', 'img/broken.png.webp').addClass('broken-image');
)
));
9) Оквир мора бити увек сигуран да одговара садржају странице.
10) У Јкуери се могу додати властити филтри за одабир. као што се све у филтрима за одабир библиотеке такође може прилагодити.додавање објекта $ .екпр (':') ово ће учинити.
Нпр:
(function($)
(
var random = 0
$.expr(':').random = function(a, i, m, r)
(
if (i == 0)
(
random = Math.floor(Math.random() * r.length);
)
return i == random;
);
))(jQuery);
// how to utilize this piece of code.
$('li:random').addClass('glow');
11) Додавање атрибута онеспособљено улазу омогућава да поље уноса буде онемогућено док се не попуне одређена релативна поља.
Нпр:
$('input(type="submit")').prop('disabled', true);
12) Обавезно дефинишите одељак за обраду грешака како бисте могли да обрађујете повратке грешака ајак. када се погоди грешка 400 или 500, онда ће се овај одељак аутоматски покренути.
Нпр:
$(document).on('ajaxError', function (e, xhr, settings, error)
(
console.log(error);
));
ЈКуери - закључак
Јкуери смањује додатну сложеност коју ЈаваСцрипт држи у себи. с више ентитета повезаних с јкуери стоји као један од најбољих алата за развој веб страница на тржишту. његове лагане и ефикасне могућности повезивања прилично су олакшале програмерима веб кодирање лако.
Препоручени чланак
Ово је водич за Цхеат схеет ЈКуери. Овде смо разговарали о садржају и наредби, као и бесплатним саветима и триковима цхеат схеет-а ЈКуери, такође можете погледати следећи чланак да бисте сазнали више -
- јКуери Интервју Питања
- Превара за Ц ++
- Превара за СКЛ
- ЈаваСцрипт вс ЈКуери
- Најбоља превара за УНИКС
- Цхеат Схеет ЈаваСцрипт: Које су предности
- Топ 8 јКуери селектора са имплементацијом кода