Jquery核心(二) $(...) jQuery Object Accessors

[b][size=medium]jQuery对象访问器[/size][/b]

[b][1][color=brown] each( callback )[/color][/b] [color=blue]Returns: jQuery[/color]
[color=green]callback [/color]: Function 每个匹配的元素要执行的回调函数。
[color=olive]说明[/color]: 让每个匹配的元素执行该回调函数。this指向匹配的DOM元素,而不是jQuery对象。[b]另外,回调参数有一个以0开始的整型参数,可以标志运行函数的DOM元素在匹配元素集合中的下标。[/b](用return false结束循环,用return true跳出本次循环,作用如break,continue)。本方法与$.each()不一样,$.each()可以遍历诸如数组及一般的对象。
$("span").click(function () {
$("li").each(function(i){
$(this).toggleClass("example");
});
});


[b][2][color=brown] size( ) [/color][/b] [color=blue]Returns: Number[/color]

[color=olive]说明[/color]: 返回jQuery对象中元素的个数。该方法和jQuery对象的length属性返回相同的结果。然而,该方法的执行效率没有length属性高,所以建议用length属性。
$(document.body).click(function () { $(document.body).append($("<div>"));
var n = $("div").size();
$("span").text("There are " + n + " divs." + "Click to add more.");}).click();
// trigger the click to start


[b][3][color=brown] length [/color][/b] [color=blue]Returns: Number[/color]

[color=olive]说明[/color]: 返回jQuery对象中元素的个数。
 $(document.body).click(function () {
$(document.body).append($("<div>"));
var n = $("div").length;
$("span").text("There are " + n + " divs." +
"Click to add more.");
}).trigger('click'); // trigger the click to start



[b][4][color=brown] selector[/color][/b] [color=blue]Returns: String[/color]

[color=olive]说明[/color]: jQuery 1.3中新增的属性。以字符串形式返回jQuery()中的选择器。
 $("ul")
.append("<li>" + $("ul").selector + "</li>")
.append("<li>" + $("ul li").selector + "</li>")
.append("<li>" + $("div#foo ul:not([class])").selector + "</li>");

[list]
* ul
* ul li
* div#foo ul:not([class])
[/list]

[b][5][color=brown] context[/color][/b] [color=blue]Returns: Element[/color]

[color=olive]说明[/color]: jQuery 1.3中新增的属性。返回jQuery()中传入参数的DOM节点上下文(如果没有传入,则下下文为document)。应与seletor属性一起使用以确定一个精确的查找对象。context与seletor两个属性对于插件开发人员来说非常有用。
 $("ul")
.append("<li>" + $("ul").context + "</li>")
.append("<li>" + $("ul", document.body).context.nodeName + "</li>");

[list]
* [object HTMLDocument]
* BODY
[/list]

[b][6][color=brown] eq( position ) [/color][/b] [color=blue]Returns: jQuery[/color]
[color=green]position [/color]: Number 将被选择的元素的下标。
[color=olive]说明[/color]: 将匹配的元素集合减少到一个。position[ 0,length-1 ]。如果传入一个超出范围的下标,则返回一个空的jQuery对象
 $("p").eq(1).css("color", "red")


[b][7][color=brown] get( ) [/color][/b] [color=blue]Returns: Array<Element>[/color]

[color=olive]说明[/color]: 使用所有匹配的DOM元素。不同于jQuery,它返回的是一个元素数组。用来代替jQuery内置函数来操作匹配的元素本身,这个方法非常好用。
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() );



[b][8][color=brown] get( index ) [/color][/b] [color=blue]Returns: Element[/color]
[color=green]position [/color]: Number 将被作用的元素的下标。
[color=olive]说明[/color]: 在匹配的元素集合中指定一个元素。
$("*", document.body).click(function (e) {
e.stopPropagation();
var domEl = $(this).get(0);
$("span:first").text("Clicked on - " + domEl.tagName);
});


[b][9][color=brown] index( subject ) [/color][/b] [color=blue]Returns: Number[/color]
[color=green]subject [/color]: Element,jQuery 要被查询的对象。
[color=olive]说明[/color]: 返回匹配的元素在页面中的下标,以0开始的整数。如未找到匹配元素,返回-1。若传入的是一个jQuery对象,则返回jQuery对象中第一个元素的下标。
$("div").click(function () {
// this is the dom element clicked
var index = $("div").index(this);
$("span").text("That was div index #" + index);
});



[size=medium]注:原文内容请参见[url]http://docs.jquery.com/Main_Page[/url][/size]


-------------------------------------------------------------------------------------------------------------------------------
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值