jquery对象访问

最新推荐文章于 2021-08-29 14:35:02 发布

会做饭的技术男

最新推荐文章于 2021-08-29 14:35:02 发布

阅读量126

点赞数

分类专栏：前端

原文链接：https://www.mk2048.com/blog/blog.php?id=hjhjibkabj2j&title=jquery%E5%AF%B9%E8%B1%A1%E8%AE%BF%E9%97%AE

版权

前端专栏收录该内容

2508 篇文章 11 订阅

订阅专栏

jquery对象访问

方法名	说明	语法（callback 执行的函数，object指定元素的对象。）
each()	用于以当前jQuery对象匹配到的每个元素作为上下文来遍历执行指定的函数	`jQueryObject.each( callback )`
size()	用于返回当前jQuery对象封装的元素个数。如果该对象是一个空的jQuery对象，没有封装任何元素，则返回0。	`jQueryObject.size( )`
length	属性用于返回当前jQuery对象封装的元素个数。length属性与size()方法的作用相同。	`jQueryObject.length`
index()	用于获取当前jQuery对象中指定DOM元素的索引值。指定元素的索引位置(从0开始算起)。	`jQueryObject.index( [ object ] )`
context	用于返回获取当前jQuery对象时传给jQuery(selector, context)函数的context参数。	`jQueryObject.context`
selector	用于返回获取当前jQuery对象时传给jQuery(selector, context)函数的原始选择器(即selector参数)。	`jQueryObject.selector`

1.each()函数用于以当前jQuery对象匹配到的每个元素作为上下文来遍历执行指定的函数。each()函数将根据匹配到的每一个元素循环调用函数callback。每次调用函数callback时，each()函数都会将callback函数内部的this引用指向当前正在迭代的元素，并为其传入两个参数。第一个参数是当前迭代元素在匹配到的元素中的索引值(从0开始计数)，第二个参数是当前迭代元素(与this的引用相同)。each()函数还会根据每次调用函数callback的返回值来决定后续动作。如果返回值为false，则停止循环(相当于普通循环中的break)；如果返回其他任何值，均表示继续执行下一个循环。
将所有的<li>元素的innerHTML改为"编号n"(n为1、2、3……)：
$("ul li").each(function(index,element){
$(element).html("编号"+(index+1));
});
订购按钮的点击事件，用于处理商品订购事务，要求每次订购的商品重量不得超过100kg，否则无法订购并提示相应信息：
$("#btnBuy").click(function(){
var weight=0;
//遍历选中的商品
$("[name=goods_weight]:checked").each(function(){
weight+=weight+parseInt(this.value);
if(weight>100){
return false; //跳出遍历
}
});
if(weight<=0){
alert("没有选择任何商品");
}else if(weight>100){
alert("订购的商品总和超重100kg了");
}else{
alert("订购成功！"+weight+"kg");
}
});

2.size() 函数用于返回当前jQuery对象封装的元素个数。如果该对象是一个空的jQuery对象，没有封装任何元素，则返回0。
alert($("ul li").size() );
3.length 属性用于返回当前jQuery对象封装的元素个数。length属性与size()方法的作用相同。
alert($("ul li").length );
4.index()函数用于获取当前jQuery对象中指定DOM元素的索引值。指定元素的索引位置(从0开始算起)。
5.context属性用于返回获取当前jQuery对象时传给jQuery(selector, context)函数的context参数。
// 返回当前文档的document对象
var $li = $("ul li");
document.writeln( $li.context ); // [object HTMLDocument]
document.writeln( $li.context === document ); // true
6.selector属性用于返回获取当前jQuery对象时传给jQuery(selector, context)函数的原始选择器(即selector参数)。
alert($("ul li").selector );

html页面：
<body>
<div id="n1">
<div id="n2">
<ul id="n3">
<li id="n4">item1</li>
<li id="n5">item2</li>
<li id="n6">item3</li>
</ul>
</div>
</div>
<form id="demoForm">
<input name="goods_weight" type="checkbox" value="20">A(20kg)<br>
<input name="goods_weight" type="checkbox" value="33">B(33kg)<br>
<input name="goods_weight" type="checkbox" value="36">C(36kg)<br>
<input name="goods_weight" type="checkbox" value="49">D(49kg)<br>
<input name="goods_weight" type="checkbox" value="56">E(56kg)<br>
<input name="goods_weight" type="checkbox" value="78">F(78kg)<br>
<input id="btnBuy" type="button" value="订购">
</form>
</body>

会做饭的技术男

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery对象访问

jquery对象访问方法名说明语法（callback 执行的函数，object指定元素的对象。）each()用于以当前jQuery对象匹配到的每个元素作为上下文来遍历执行指定的函数jQueryObject.each( callback )size()用于返回当前jQuery对象封装的元素个数。如果该对象是一个空的jQuery对象，没有封装任何元素，则...
复制链接

扫一扫