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

من موسوعة حسوب
اذهب إلى التنقل اذهب إلى البحث
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

يجلب عناصر 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>

مصادر