jquery对象,jQuery对象访问器

[1] each( callback ) Returns: jQuery
callback : Function 每个匹配的元素要执行的回调函数。
说明: 让每个匹配的元素执行该回调函数。this指向匹配的DOM元素,而不是jQuery对象另外,回调参数有一个以0开始的整型参数,可以标志运行函数的DOM元素在匹配元素集合中的下标。(用return false结束循环,用return true跳出本次循环,作用如break,continue)。本方法与$.each()不一样,$.each()可以遍历诸如数组及一般的对象
Js代码
jquery对象,jQuery对象访问器

$("span").click(function () { $("li").each(function(i){ $(this).toggleClass("example"); }); }); Js代码
jquery对象,jQuery对象访问器

$("span").click(function () { $("li").each(function(i){ $(this).toggleClass("example"); }); }); $("span").click(function () { $("li").each(function(i){ $(this).toggleClass("example"); });});
[2] size( ) Returns: Number
说明: 返回jQuery对象中元素的个数。该方法和jQuery对象的length属性返回相同的结果。然而,该方法的执行效率没有length属性高,所以建议用length属性。
Js代码
jquery对象,jQuery对象访问器

$(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 Js代码
jquery对象,jQuery对象访问器

$(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 $(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
[3] length Returns: Number
说明: 返回jQuery对象中元素的个数。
Js代码
jquery对象,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 Js代码
jquery对象,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 $(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
[4] selector Returns: String
说明: jQuery 1.3中新增的属性。以字符串形式返回jQuery()中的选择器。
Js代码
jquery对象,jQuery对象访问器

$("ul") .append("<li>" + $("ul").selector + "</li>") .append("<li>" + $("ul li").selector + "</li>") .append("<li>" + $("div#foo ul:not([class])").selector + "</li>"); Js代码
jquery对象,jQuery对象访问器

$("ul") .append("<li>" + $("ul").selector + "</li>") .append("<li>" + $("ul li").selector + "</li>") .append("<li>" + $("div#foo ul:not([class])").selector + "</li>"); $("ul") .append("<li>" + $("ul").selector + "</li>") .append("<li>" + $("ul li").selector + "</li>") .append("<li>" + $("div#foo ul:not([class])").selector + "</li>");
* ul
* ul li
* div#foo ul:not([class])
[5] context Returns: Element
说明: jQuery 1.3中新增的属性。返回jQuery()中传入参数的DOM节点上下文(如果没有传入,则下下文为document)。应与seletor属性一起使用以确定一个精确的查找对象。context与seletor两个属性对于插件开发人员来说非常有用。
Js代码
jquery对象,jQuery对象访问器

$("ul") .append("<li>" + $("ul").context + "</li>") .append("<li>" + $("ul", document.body).context.nodeName + "</li>"); Js代码
jquery对象,jQuery对象访问器

$("ul") .append("<li>" + $("ul").context + "</li>") .append("<li>" + $("ul", document.body).context.nodeName + "</li>"); $("ul") .append("<li>" + $("ul").context + "</li>") .append("<li>" + $("ul", document.body).context.nodeName + "</li>");
* [object HTMLDocument]
* BODY
[6] eq( position ) Returns: jQuery
position : Number 将被选择的元素的下标。
说明: 将匹配的元素集合减少到一个。position[ 0,length-1 ]。如果传入一个超出范围的下标,则返回一个空的jQuery对象
Js代码
jquery对象,jQuery对象访问器

$("p").eq(1).css("color", "red") Js代码
jquery对象,jQuery对象访问器

$("p").eq(1).css("color", "red") $("p").eq(1).css("color", "red")
[7] get( ) Returns: Array<Element>
说明: 使用所有匹配的DOM元素。不同于jQuery,它返回的是一个元素数组。用来代替jQuery内置函数来操作匹配的元素本身,这个方法非常好用。
Js代码
jquery对象,jQuery对象访问器

function disp(divs) { var a = []; for (var i = 0; i < divs.length; i++) { a.push(divs.innerHTML); } $("span").text(a.join(" ")); } disp( $("div").get().reverse() ); Js代码
jquery对象,jQuery对象访问器

function disp(divs) { var a = []; for (var i = 0; i < divs.length; i++) { a.push(divs.innerHTML); } $("span").text(a.join(" ")); } disp( $("div").get().reverse() ); function disp(divs) { var a = []; for (var i = 0; i < divs.length; i++) { a.push(divs.innerHTML); } $("span").text(a.join(" ")); } disp( $("div").get().reverse() );
[8] get( index ) Returns: Element
position : Number 将被作用的元素的下标。
说明: 在匹配的元素集合中指定一个元素。
Js代码
jquery对象,jQuery对象访问器

$("*", document.body).click(function (e) { e.stopPropagation(); var domEl = $(this).get(0); $("span:first").text("Clicked _disibledevent=>
jquery对象,jQuery对象访问器

$("*", document.body).click(function (e) { e.stopPropagation(); var domEl = $(this).get(0); $("span:first").text("Clicked _disibledevent=>
[9] index( subject ) Returns: Number
subject : Element,jQuery 要被查询的对象
说明: 返回匹配的元素在页面中的下标,以0开始的整数。如未找到匹配元素,返回-1。若传入的是一个jQuery对象,则返回jQuery对象中第一个元素的下标。
Js代码
jquery对象,jQuery对象访问器

$("div").click(function () { // this is the dom element clicked var index = $("div").index(this); $("span").text("That was div index #" + index); }); Js代码
jquery对象,jQuery对象访问器

$("div").click(function () { // this is the dom element clicked var index = $("div").index(this); $("span").text("That was div index #" + index); });
Tags: 

延伸阅读

最新评论

发表评论