الفرق بين المراجعتين ل"jQuery/get"
جميل-بيلوني (نقاش | مساهمات) (هذه الصفحة من مساهمات عدنان أمزيان.) |
|||
| سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE:التابع <code>.get()</code> في jQuery}}</noinclude> | <noinclude>{{DISPLAYTITLE:التابع <code>.get()</code> في jQuery}}</noinclude> | ||
| − | يجلب عناصر DOM المطابقة والمخزنة في كائن jQuery. | + | يجلب عناصر DOM المطابقة والمخزنة في كائن [[jQuery/jQuery|jQuery]]. |
== <code>.get( index )</code> == | == <code>.get( index )</code> == | ||
=== الوصف === | === الوصف === | ||
| − | يعيد هذا التابع عنصرًا واحدًا من العناصر الموجودة في كائن jQuery. | + | يعيد هذا التابع عنصرًا واحدًا من العناصر الموجودة في كائن [[jQuery/jQuery|jQuery]]. |
=== <code>.get( index )</code> === | === <code>.get( index )</code> === | ||
| سطر 32: | سطر 32: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | == أمثلة == | + | === أمثلة === |
إظهار اسم العنصر عند الضغط عليه:<syntaxhighlight lang="html"> | إظهار اسم العنصر عند الضغط عليه:<syntaxhighlight lang="html"> | ||
<!doctype html> | <!doctype html> | ||
| − | |||
<html lang="en"> | <html lang="en"> | ||
| − | |||
<head> | <head> | ||
| − | + | <meta charset="utf-8"> | |
| − | + | <title>get demo</title> | |
| − | + | <style> | |
| − | + | span { | |
| − | + | color: red; | |
| − | + | } | |
| − | + | div { | |
| − | + | background: yellow; | |
| − | + | } | |
| − | color: red; | + | </style> |
| − | + | <script src="https://code.jquery.com/jquery-1.10.2.js"></script> | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | background: yellow; | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
</head> | </head> | ||
| − | |||
<body> | <body> | ||
| − | + | ||
<span> </span> | <span> </span> | ||
| − | |||
<p>In this paragraph is an <span>important</span> section</p> | <p>In this paragraph is an <span>important</span> section</p> | ||
| − | |||
<div><input type="text"></div> | <div><input type="text"></div> | ||
| − | + | ||
<script> | <script> | ||
| − | |||
$( "*", document.body ).click(function( event ) { | $( "*", document.body ).click(function( event ) { | ||
| − | + | event.stopPropagation(); | |
| − | + | var domElement = $( this ).get( 0 ); | |
| − | + | $( "span:first" ).text( "Clicked on - " + domElement.nodeName ); | |
| − | |||
| − | |||
| − | |||
| − | |||
}); | }); | ||
| − | |||
</script> | </script> | ||
| − | + | ||
</body> | </body> | ||
| − | |||
</html> | </html> | ||
| − | |||
| − | |||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | == <code>.get()</code> == | + | === <code>.get()</code> === |
| − | === القيم المعادة === | + | ==== القيم المعادة ==== |
يعيد مصفوفةً من النوع [[JavaScript/Array|Array]]. | يعيد مصفوفةً من النوع [[JavaScript/Array|Array]]. | ||
| − | === الوصف === | + | ==== الوصف ==== |
يعيد هذا التابع كل عناصر DOM التي تم انتقائها وتخزينها في كائن jQuery. | يعيد هذا التابع كل عناصر DOM التي تم انتقائها وتخزينها في كائن jQuery. | ||
| − | === <code>.get()</code> === | + | ==== <code>.get()</code> ==== |
أُضيف مع الإصدار: 1.0. هذا التابع لا يقبل أي وسائط. | أُضيف مع الإصدار: 1.0. هذا التابع لا يقبل أي وسائط. | ||
| سطر 116: | سطر 90: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | == أمثلة == | + | === أمثلة === |
تحديد كل عناصر <code>[[HTML/div|<nowiki><div></nowiki>]]</code> الموجودة في الصفحة وإعادتها في مصفوفة، ثمَّ بعدئذٍ عكس هذه المصفوفة باستخدام التابع <code>reverse()</code> الخاص بالكائن Array في JavaScript:<syntaxhighlight lang="html"> | تحديد كل عناصر <code>[[HTML/div|<nowiki><div></nowiki>]]</code> الموجودة في الصفحة وإعادتها في مصفوفة، ثمَّ بعدئذٍ عكس هذه المصفوفة باستخدام التابع <code>reverse()</code> الخاص بالكائن Array في JavaScript:<syntaxhighlight lang="html"> | ||
<!doctype html> | <!doctype html> | ||
| سطر 150: | سطر 124: | ||
== مصادر == | == مصادر == | ||
| − | * [http://api.jquery.com/get/ صفحة التابع .get() في توثيق jQuery الرسمي.] | + | * [http://api.jquery.com/get/ صفحة التابع .get() في توثيق jQuery الرسمي.] |
[[تصنيف:jQuery]] | [[تصنيف:jQuery]] | ||
[[تصنيف:jQuery Miscellaneous]] | [[تصنيف:jQuery Miscellaneous]] | ||
مراجعة 10:01، 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> </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>