jQuery 核心2_jQuery对象访问

最新推荐文章于 2025-04-17 15:58:14 发布

原创最新推荐文章于 2025-04-17 15:58:14 发布 · 439 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #function #callback #div #object #class

jquery 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了jQuery库中的关键方法，包括each()用于遍历元素集合、size()和length属性获取元素数量、selector返回原始选择器字符串、context获取原始DOM节点、get()获取DOM元素集合以及index()查找元素索引。

each(callback)
size()
length
selector
context
get()
get(index)
index(subject)

======================================
1. each(callback)

   e.g.1:
<html> <head><title>test each</title> <mce:script src="http://www.pingan.com/app_js/jquery-1.3.2.js" mce_src="http://www.pingan.com/app_js/jquery-1.3.2.js" type="text/javascript"></mce:script> </head> <body> <img/><img/> <button>Change colors</button> <span></span> <div></div> <div></div> <div></div> <div></div> <div id="stop">Stop here</div> <div></div> <div></div> <div></div> <mce:script type="text/javascript"></mce:script> </body> </html>

------------------------------------------------
2. size()
与jQuery 对象的'length' 属性一致,获取对象中元素的个数
   e.g.1:
      J: $("img").size();

------------------------------------------------
3. length
   e.g.1:
   J: $("img").length;

------------------------------------------------
4. selector
返回传给jQuery()的原始选择器。
e.g.1 :
    J: $("ul")
.append("<li>" + $("ul").selector + "</li>")
.append("<li>" + $("ul li").selector + "</li>")
.append("<li>" + $("div#foo ul:not([class])").selector + "</li>");

    E: ul
       ul li
       div#foo ul:not([class])

------------------------------------------------
5. context
返回传给jQuery()的原始的DOM节点内容.
e.g.1 :
$("ul")
.append("<li>" + $("ul").context + "</li>")
.append("<li>" + $("ul", document.body).context.nodeName + "</li>");

    E: [object HTMLDocument] //如果是IE浏览器，则返回[object]
       BODY

------------------------------------------------
6. get()
取得所有匹配的DOM元素集合。
     e.g.1 :
    H: <img src="test1.jpg"/> <img src="test2.jpg"/>

    J: $("img").get().reverse();    //选择文档中所有图像作为元素数组，并用数组的reverse方法将数组反向。

    E: [ <img src="test2.jpg"/> <img src="test1.jpg"/> ]

------------------------------------------------
7. get(index)
   e.g.1:
    J: $("img").get(0);

------------------------------------------------
8. index(subject)
搜索与参数表示的对象匹配的元素，并返回相应元素的索引值。
如果找到了匹配的元素，从0开始返回；如果没有找到匹配的元素，返回-1。

   e.g.1:
   H: <div id="foobar"><div></div><div id="foo"></div></div>

   J: $("div").index($('#foobar')[0]) // 0
       $("div").index($('#foo')[0]) // 2
       $("div").index($('#foo1')) // -1