JQuery тізбектері

элементтер жиынын алайық, содан кейін кодтың бір жолында оған бірнеше әрекеттерді орындаймыз:
$('h1').text('Новый текст h1').css('color', 'green');
Бұл мысал 2 әдістің дәйекті орындалуын көрсетеді:
text() – мазмұнды өзгерту үшін;
css() – стильдерді орнату
Егер сіз консольге өтіп, $('h1').text('New text h1') орындасаңыз, оның бастапқы жиынды қайтаратынын анық көруге болады, яғни. $('h1') сияқты.
Қажет болса, оқуға ыңғайлы болу үшін кодтың бір жолын бірнеше жолға бөлуге болады. Мысалы, келесідей жазыңыз:

$('h1')

• 
  .text('Новый текст h1')
  
• 
  .css('color', 'green');
  

Айтпақшы, jQuery әдістерінің барлығы jQuery нысанын қайтармайтынына назар аудару керек.

Мысалы, аргументсіз text():

var text = $('h1').text();

text() әдісіне ешқандай аргумент жібермегенде, ол jQuery нысанының орнына элементтің мәтіндік мазмұнын қайтарады. Сондықтан, бұл жағдайда jQuery әдістерін одан әрі шақыруды жалғастыра алмаймыз:

// так работать не будет
$('h1').text().css('color', 'green');

jQuery-де әрекеттерді/әдістерді бір-біріне тіркей аласыз.

Тізбектеу бір мәлімдемеде бірнеше jQuery әдістерін (бір элементпен) орындауға мүмкіндік береді.
Осы уақытқа дейін біз jQuery өрнектерін бір-бірлеп (бірінен соң бірі) жаздық.
Дегенмен, jQuery өрнектерін жазудың «тізбектеу» деп аталатын ерекше тәсілі бар. Бұл әдіс арқылы біз бір элементте бірнеше jQuery пәрмендерін бірінен соң бірін іске қоса аламыз. Бұл жағдайда браузер қажетті элементті бірнеше рет іздеудің қажеті жоқ.
Бірнеше пәрменді тізбектеу үшін келесі пәрменді алдыңғысына қосу жеткілікті.
Келесі мысал css(), slideUp() және slideDown() пәрмендерін тізбектейді. "p1" элементі алдымен қызылға айналады, содан кейін жиырылады, содан кейін кеңейеді:

$("#p1").css("color", "red").slideUp(2000).slideDown(2000);

Қажет болса, біз қосымша пәрмендерді қоса аламыз.

Тізбектеу кезінде код жолы өте ұзақ болуы мүмкін. Бақытымызға орай, jQuery синтаксиспен өте қатал емес - кодты қалағаныңызша пішімдеуге болады, мысалы, жол үзілімдері мен шегіністер.
Келесі жазба да жақсы жұмыс істейді:

$("#p1").css("color", "red")

.slideUp(2000)
.slideDown(2000);

jQuery қосымша бос орынды алып тастап, оны кодтың бір ұзын жолына ұқсатады.

Бағалау .
Білім алушылардың жинаған балдарын есептеу бағасын шығару.


Қорытындылау.
Сабаққа шолу жасап, жетістіктері мен кемшіліктеріне тоқталып, қорытындылау.


Үйге тапсырма беру. jQuery тізбектері