Jquery-核心:常用页面元素对象访问器

1.      each(callback)

以每一个匹配的元素作为上下文来执行一个函数。

Example:

迭代两个图像,并设置它们的 src 属性。注意:此处 this 指代的是 DOM 对象而非 jQuery 对象。

1 <img/><img/>
2 
3 3$("img").each(function(i){
4    this.src = "test" + i + ".jpg";
5 });
6 [ <img src="test0.jpg" />, <img src="test1.jpg" /> ]     //结果

2.      size()

jQuery 对象中元素的个数。这个函数的返回值与jQuery 对象的'length' 属性一致。

Example:

计算文档中所有图片数量

1 <img src="test1.jpg"/> <img src="test2.jpg"/>
2 
3 $(“img”).size();
4 
5 2            //结果

3.      length()

jQuery 对象中元素的个数。这个函数的返回值与jQuery 对象的'length' 属性一致。

Example:

计算文档中所有图片数量

1 <img src="test1.jpg"/> <img src="test2.jpg"/>
2 $(“img”).length();
3 
4 2            //结果

4.      selector()

返回传给jQuery()的原始选择器。

Example:

确定查询的选择器

1  $("ul")
2   .append("<li>" + $("ul").selector + "</li>")
3   .append("<li>" + $("ul li").selector + "</li>")
4   .append("<li>" + $("div#foo ul:not([class])").selector + "</li>");
5        //结果
6         ul
7         ul li
8         div#foo ul:not([class])

5.      context()

返回传给jQuery()的原始的DOM节点内容,即jQuery()的第二个参数。如果没有指定,那么context指向当前的文档(document)。

Example:

检测使用的文档内容

1 $("ul")
2   .append("<li>" + $("ul").context + "</li>")
3   .append("<li>" + $("ul", document.body).context.nodeName + "</li>");
4 [object HTMLDocument]       //结果
5 BODY 
6 
7 //如果是IE浏览器,则返回[object]

6.      get()

取得所有匹配的 DOM 元素集合。

Example:

选择文档中所有图像作为元素数组,并用数组内建的 reverse 方法将数组反向。

1 <img src="test1.jpg"/> <img src="test2.jpg"/>
2 jQuery 代码: $("img").get().reverse();
3 [ <img src="test2.jpg"/> <img src="test1.jpg"/> ]      //结果

7.      get(index)

取得其中一个匹配的元素。 num表示取得第几个匹配的元素。

Example:

1 <img src="test1.jpg"/> <img src="test2.jpg"/>
2 jQuery 代码: $("img").get(0);
3 <img src="test1.jpg"/> ]     //结果

 

8.      index([subject])

搜索匹配的元素,并返回相应元素的索引值,从0开始计数。

如果不给 .index() 方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的位置。

如果参数是一组DOM元素或者jQuery对象,那么返回值就是传递的元素相对于原先集合的位置。

如果参数是一个选择器,那么返回值就是原先元素相对于选择器匹配元素中的位置。如果找不到匹配的元素,则返回-1。

Example:

查找元素的索引值

 1 <ul>
 2   <li id="foo">foo</li>
 3   <li id="bar">bar</li>
 4   <li id="baz">baz</li>
 5 </ul>
 6 
 7 $('li').index(document.getElementById('bar'));     //1,传递一个DOM对象,返回这个对象在原先集合中的索引位置
 8 $('li').index($('#bar'));    //1,传递一个jQuery对象
 9 $('li').index($('li:gt(0)'));    //1,传递一组jQuery对象,返回这个对象中第一个元素在原先集合中的索引位置
10 $('#bar').index('li');    //1,传递一个选择器,返回#bar在所有li中的做引位置
11 $('#bar').index();    //1,不传递参数,返回这个元素在同辈中的索引位置。

 

posted @ 2014-08-24 23:11  Shan MJ  阅读(194)  评论(0编辑  收藏  举报