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

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

يجلب عناصر DOM المطابقة والمخزنة في كائن jQuery.

‎.get( index )‎

الوصف

يعيد هذا التابع عنصرًا واحدًا من العناصر الموجودة في كائن jQuery.

‎.get( index )‎

index

فهرس صفري من النوع Number (عدد صحيح) يشير إلى العنصر المراد إعادته.

يوفر التابع ‎.get()‎ إمكانية الوصول إلى كل عناصر DOM الموجودة في كل كائن jQuery. إذا كانت قيمة الفهرس index خارج المجال (أي أصغر من عدد العناصر الموجودة ضمن الكائن – أي قيمة سالبة – أو أكبر أو تساوي عدد هذه العناصر)، فسيعيد التابع القيمة undefined.

بفرض أنه لدينا قائمة غير مرتبة <ul> كالآتية:

<ul>
  <li id="foo">foo</li>
  <li id="bar">bar</li>
</ul>

عندما تُعطى قيمة للوسيط index، فسيعيد التابع ‎.get(index)‎ عنصرًا واحدًا:

Console.log( $( "li" ).get( 0 ) );

بما أن الفهرس صفري (يبدأ من الصفر)، فسيعاد أول عنصر من القائمة:

<li id="foo">

يمكن أن يعد كل كائن jQuery على أنه مصفوفة، لذا يمكننا إعادة أي عنصر من عناصر القائمة باستعمال معاملات المصفوفات:

console.log( $( "li" )[ 0 ] );

على أية حال، ينقص هذه الصياغة بعض مميزات التابع ‎.get()‎ مثل إعطاء قيمة سالبة للفهرس:

console.log( $( "li" ).get( -1 ) );

عند إعطاء قيمة سالبة للفهرس index، فسيبدأ العد من آخر مجموعة العناصر لذا سيعيد المثال السابق آخر عنصر <li> موجود في القائمة:

<li id="bar">

أمثلة

إظهار اسم العنصر عند الضغط عليه:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>get demo</title>
  <style>
  span {
    color: red;
  }
  div {
    background: yellow;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<span>&nbsp;</span>
<p>In this paragraph is an <span>important</span> section</p>
<div><input type="text"></div>
 
<script>
$( "*", document.body ).click(function( event ) {
  event.stopPropagation();
  var domElement = $( this ).get( 0 );
  $( "span:first" ).text( "Clicked on - " + domElement.nodeName );
});
</script>
 
</body>
</html>

‎.get()‎

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

يعيد مصفوفةً من النوع Array.

الوصف

يعيد هذا التابع كل عناصر DOM التي تم انتقائها وتخزينها في كائن jQuery.

‎.get()‎

أُضيف مع الإصدار: 1.0. هذا التابع لا يقبل أي وسائط.

لنفترض أنه لدينا قائمة بسيطة غير مرتَّبة <ul> كالآتية:

<ul>                              	
  <li id="foo">foo</li>
  <li id="bar">bar</li>
</ul>

عندما لا يُمرَّر أي معامل، فسيعيد التابع ‎.get()‎ مصفوفةً تحتوي على كل العناصر الموجودة في كائن jQuery.

console.log( $( "li" ).get() );

كل العناصر الموجودة في كائن jQuery ستُعاد بعد تنفيذ السطر السابق على شكل مصفوفة تضم كل تلك العناصر:

[ <li id="foo">, <li id="bar"> ]

أمثلة

تحديد كل عناصر <div> الموجودة في الصفحة وإعادتها في مصفوفة، ثمَّ بعدئذٍ عكس هذه المصفوفة باستخدام التابع reverse()‎ الخاص بالكائن Array في JavaScript‏:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>get demo</title>
  <style>
  span {
	color: red;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
Reversed - <span></span>
<div>One</div>
<div>Two</div>
<div>Three</div>
<script>
function display( divs ) {
  var a = [];
  for ( var i = 0; i < divs.length; i++ ) {
	a.push( divs[ i ].innerHTML );
  }
  $( "span" ).text( a.join(" ") );
}
display( $( "div" ).get().reverse() );
</script>
</body>
</html>

مصادر