القائمة الرئيسية

الصفحات

jQuery - محددات


تستخدم مكتبة jQuery قوة محددات أوراق الأنماط المتتالية (CSS) للسماح لنا بالوصول بسرعة وسهولة إلى العناصر أو مجموعات العناصر في نموذج كائن المستند (DOM). محدد jQuery هو وظيفة تستخدم التعبيرات لاكتشاف العناصر المطابقة من DOM بناءً على المعايير المحددة. ببساطة يمكنك القول ، يتم استخدام المحددات لتحديد عنصر HTML واحد أو أكثر باستخدام jQuery. بمجرد تحديد عنصر ، يمكننا إجراء عمليات مختلفة على هذا العنصر المحدد.

The $() factory function

تبدأ محددات jQuery بعلامة الدولار والأقواس - $ (). تستخدم وظيفة المصنع $ () العناصر الثلاثة التالية أثناء تحديد العناصر في مستند معين -

Sr.No.Selector & Description
1

Tag Name

Represents a tag name available in the DOM. For example $('p') selects all paragraphs <p> in the document.

2

Tag ID

Represents a tag available with the given ID in the DOM. For example $('#some-id') selects the single element in the document that has an ID of some-id.

3

Tag Class

Represents a tag available with the given class in the DOM. For example $('.some-class') selects all elements in the document that have a class of some-class.

يمكن استخدام جميع العناصر المذكورة أعلاه إما بمفردها أو بالاشتراك مع محددات أخرى. تعتمد جميع محددات jQuery على نفس المبدأ باستثناء بعض التعديلات. ملاحظة - دالة المصنع $ () هي مرادف لوظيفة jQuery (). لذلك إذا كنت تستخدم أي مكتبة JavaScript أخرى حيث يتعارض $ sign مع شيء آخر ، فيمكنك استبدال $ sign بواسطة اسم jQuery ويمكنك استخدام الوظيفة jQuery () بدلاً من $ ().

المثال التالي هو مثال بسيط يستخدم محدد العلامات. سيؤدي هذا إلى تحديد جميع العناصر التي تحمل اسم علامة p.


<html>
   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript" 
         src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>

      <script type = "text/javascript" language = "javascript">
         $(document).ready(function() {
            $("p").css("background-color", "yellow");
         });
      </script>
   </head>
	
   <body>
      <div>
         <p class = "myclass">This is a paragraph.</p>
         <p id = "myid">This is second paragraph.</p>
         <p>This is third paragraph.</p>
      </div>
   </body>
</html>

كيفية استخدام المحددات؟ المحددات مفيدة جدًا وستكون مطلوبة في كل خطوة أثناء استخدام jQuery. يحصلون على العنصر الذي تريده بالضبط من مستند HTML الخاص بك. يسرد الجدول التالي بعض المحددات الأساسية ويشرحها بأمثلة.

Sr.No.Selector & Description
1Name

Selects all elements which match with the given element Name.

2#ID

Selects a single element which matches with the given ID.

3.Class

Selects all elements which match with the given Class.

4Universal (*)

Selects all elements available in a DOM.

5Multiple Elements E, F, G

Selects the combined results of all the specified selectors E, F or G.

Selectors Examples

Similar to above syntax and examples, following examples would give you understanding on using different type of other useful selectors −

أمثلة على المحددات على غرار ما ورد أعلاه من بناء الجملة والأمثلة ، من شأن الأمثلة التالية أن تمنحك فهمًا لاستخدام نوع مختلف من المحددات المفيدة الأخرى -

You can use all the above selectors with any HTML/XML element in generic way. For example if selector $("li:first") works for <li> element then $("p:first") would also work for <p> element.

هل اعجبك الموضوع :

تعليقات