תיאור:
פונה אל מערך אובייקטים
DOM.
שיטה
.get()
מאפשרת גישה לצמתים של
DOM jQuery,
שנמצאים בבסיס של כל אובייקט.
נניח שיש לנו בדף רשימה פשוטה לא מסודרת:
<ul> <li id="foo">foo</li> <li id="bar">bar</li> </ul>
ללא פרמטר,
.get()
מחזירה כל האלמנטים:
alert($('li').get());
כל הצמתים של DOM שמוחזרים על ידי קריאה הזאת נמצאים במערך סטנדרטי:
[<li id="foo">, <li id="bar">]
אם צוין אינדקס,
.get()
מחזירה אלמנט בודד:
($('li').get(0));
מכיוון שאינדקס מתחיל מאפס, יוחזר אלמנט הראשון:
<li id="foo">
כל אובייקט jQuery הוא גם מערך, לכן אנחנו יכולים להשתמש באופרטור של מערך, כדי להגיע לאלמנט ברשימה:
alert($('li')[0]);
עם זאת, לתחביר הזה חסר מספר אפשרויות של
.get(),
כמו אינדקס שלילי:
alert($('li').get(-1));
אידקס שלילי סופר מסוף הרשימה, לכן דוגמה הזו תחזיר אלמנט אחרון ברשימה:
<li id="bar">
דוגמאות
דוגמה 1
בוחר כל האלמנטים div במסמך ומחזיר אותם כמערך, אחרי זה, באמצעות שיטה מובנת רברס, משנה כיוון של אלמנטים במערך.קוד מלא:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-1.5.js"></script>
<script>
$(document).ready(function(){
function disp(divs) {
var a = [];
for (var i = 0; i < divs.length; i++) {
a.push(divs[i].innerHTML);
}
$("span").text(a.join(" "));
}
disp( $("div").get().reverse() );
});
</script>
<style>
span { color:red; }
</style>
</head>
<body>
Reversed - <span></span>
<div>One</div>
<div>Two</div>
<div>Three</div>
</body>
</html>
דוגמה 2
מחזיר שם של תג שלחצו עליו.קוד מלא:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-1.5.js"></script>
<script>
$(document).ready(function(){
$("*", document.body).click(function (e) {
e.stopPropagation();
var domEl = $(this).get(0);
$("span:first").text("Clicked on - " + domEl.tagName);
});
});
</script>
<style>
span { color:red; }
div { background:yellow; }
</style>
</head>
<body>
<span> </span>
<p>In this paragraph is an <span>important</span> section</p>
<div><input type="text" /></div>
</body>
</html>
האם מידע זה היה מועיל?
