التابع ‎‎.has()‎‎ في jQuery

من موسوعة حسوب
< jQuery
مراجعة 23:10، 28 مايو 2018 بواسطة جميل-بيلوني (نقاش | مساهمات)
(فرق) → مراجعة أقدم | المراجعة الحالية (فرق) | مراجعة أحدث ← (فرق)
اذهب إلى التنقل اذهب إلى البحث

‎.has(selector)‎

القيم المعادة

يُعيد كائنًا من النوع jQuery.

الوصف

يختار هذا التابع من العناصر التي حُدِّدَت مسبقًا العناصرَ السليلة منها التي تحقق الشروط المطلوبة في المحددات أو تطابق عنصر DOM.

‎.has( selector )‎

أضيف مع الإصدار: 1.4.

selector

سلسلة نصية من الكائن String، وتحتوي على تعبير المحدد لمطابقة عناصر معينة.

‎.has( contained )‎

أضيف مع الإصدار: 1.4.

contained

عنصر، وهو عنصر من شجرة DOM لاختيار الأب الذي يضمه.

لنفترض أنه لدينا كائن jQuery والذي يمثل مجموعة من عناصر DOM، فسينشئ التابع ‎.has()‎ كائن jQuery جديد يحتوي على مجموعة فرعية من المجموعة الأولى، والتي تحتوي على عناصر من المجموعة الأولى التي تُطابِق العناصر السليلة منها الشرط المُمرَّر إلى هذا التابع.

نأخذ مثالًا لصفحة تحتوي على قائمة غير مرتبة <ul> متشعبة (أي يوجد عنصر <ul> داخل عنصر <li>):

<ul>
  <li>list item 1</li>
  <li>list item 2
	<ul>
      <li>list item 2-a</li>
      <li>list item 2-b</li>
	</ul>
  </li>
  <li>list item 3</li>
  <li>list item 4</li>
</ul>

يمكننا تطبيق التابع ()has. على العناصر <li> الموجودة في الصفحة مثل:

$( "li" ).has( "ul" ).css( "background-color", "red" );

ستكون نتيجة تشغيل هذه الشيفرة تلوينَ خلفية العنصر item 2 باللون الأحمر لأنه العنصر <li> الوحيد الذي له عنصر <ul> من بين العناصر السليلة.

أمثلة

التحقق إن كان العنصر موجودًا ضمن عنصر آخر:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>has demo</title>
  <style>
  .full {
	border: 1px solid red;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<ul><li>Does the UL contain an LI?</li></ul>
 
<script>
$( "ul" ).append( "<li>" +
  ( $( "ul" ).has( "li" ).length ? "Yes" : "No" ) +
  "</li>" );
$( "ul" ).has( "li" ).addClass( "full" );
</script>
 
</body>
</html>

مصادر