سلسلة jQuery (Chaining)

يقدم jQuery ميزة قوية أخرى تُدعى ربط الطرق.

يسمح الرابط بتشغيل عدة طرق jQuery على نفس العنصر في جملة واحدة.

سلسلة طرق jQuery

حتى الآن، كتبنا جملة jQuery واحدة في كل مرة (واحدة بعد الأخرى).

لكن هناك تقنية تُدعى الرابط، وتسمح بتشغيل عدة أوامر jQuery على نفس العنصر في جملة واحدة.

بهذا، لا تحتاج المتصفحة إلى البحث عن العنصر نفسه عدة مرات.

هذا ممكن لأن معظم طرق jQuery تعود بجويب jQuery، والذي يمكن استخدامه لتوليد طريقة أخرى.

السلسلة التالية من الأمثلةcss()،hide()وshow()الطريقة:

$("button").click(function() {
　　$("p").css("background-color", "coral").hide(2000).show(2000);
});

يمكننا تقسيم سطر من الأوامر إلى سطرين أو أكثر لتحسين قابلية القراءة.

مثلاً، يمكن كتابة سلسلة الأساليب في الأمثلة أعلاه كالتالي:

$("button").click(function() {
　　$("p")
　　　　.css("background-color", "coral")
　　　　.hide(2000)
　　　　.show(2000);
});

يمكننا ربط أي عدد من الطرق في جملة واحدة:

$("button").click(function() {
　　$("div")
　　　　.animate({width: "500px"})
　　　　.animate({height: "200px"})
　　　　.animate({fontSize: "10em"})
　　　　.animate({opacity: 0.3});
});

ملاحظة:بعض طرق jQuery لا تعود بجهاز jQuery، بينما تعود أخرى بناءً على المعلمات التي نرسلها إليها. لنأخذ مثالاً على ذلك:

// استخدام صحيح
$("p").css("background-color", "coral").hide(2000).show(2000);
// استخدام خاطئ
$("p").css("background-color", "coral").hide().show();