1.attr()
语法:$(selector).attr(attribute)
作用:返回指定属性attribute的值
语法:$(selector).attr(attribute,value)
作用:设定被选元素的属性和值。
2.substr()
语法:stringObject.substr(start,length)
参数:1.start:起始位置,必须为数值,负数的话从尾部开始。
2.length :结束位置, 截取多少位,不写默认到结尾。
返回值:一个新字符串,内容为从start开始length结束。
实例:
function getApproveItems(){
var approveStr="";
var list=$(".level_b1:checked"); //定义一个变量,值为所有 .level_b1:checked
for(var i=0;i<list.length;i++){ // 进行for循环
approveStr += $(list[i]).attr("approveProcessKey")+","; // 进行字符串拼接, 每一个list对应的approveProcessKey,
}approveStr=approveStr.substr(0,approveStr.length-1); // 截取字符串到approveStr.length-1 , 意为去掉逗号
return approveStr; //返回字符串
}
3.attr() & .prop()
语法
返回属性的值:
$(selector).prop(property)
设置属性和值:
$(selector).prop(property,value)
使用函数设置属性和值:
$(selector).prop(property,function(index,currentvalue))
设置多个属性和值:
$(selector).prop({property:value, property:value,...})
对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
上面的描述也许有点模糊,举几个例子就知道了。
<a href="http://www.baidu.com" target="_self" class="btn">百度</a>
这个例子里<a>元素的DOM属性有“href、target和class",这些属性就是<a>元素本身就带有的属性,也是W3C标准里就包含有这几个属性,或者说在IDE里能够智能提示出的属性,这些就叫做固有属性。处理这些属性时,建议使用prop方法。
<a href="#" id="link1" action="delete">删除</a>
这个例子里<a>元素的DOM属性有“href、id和action”,很明显,前两个是固有属性,而后面一个“action”属性是我们自己自定义上去的,<a>元素本身是没有这个属性的。这种就是自定义的DOM属性。处理这些属性时,建议使用attr方法。使用prop方法取值和设置属性值时,都会返回undefined值。
再举一个例子:
<input id="chk1" type="checkbox" />是否可见
<input id="chk2" type="checkbox" checked="checked" />是否可见
像checkbox,radio和select这样的元素,选中属性对应“checked”和“selected”,这些也属于固有属性,因此需要使用prop方法去操作才能获得正确的结果。
$("#chk1").prop("checked") == false
$("#chk2").prop("checked") == true
如果上面使用attr方法,则会出现:
$("#chk1").attr("checked") == undefined
$("#chk2").attr("checked") == "checked"
此段转自:https://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html 与 菜鸟教程
4.each()
定义和用法
each() 方法规定为每个匹配元素规定运行的函数。
提示:返回 false 可用于及早停止循环。
语法
$(selector).each(function(index,element))
参数 描述
function(index,element)
为每个匹配元素规定运行的函数。
index - 选择器的 index 位置
element - 当前的元素(也可使用 "this" 选择器)
实例:
function getChosenAuth(){
var keys="";//定义一个变量keys为空字符串
var subDivs=$(".div_a");// 定义变量subDivs 为 $(".div_a")
for(var i=0;i< subDivs.length;i++){
var $div=$(subDivs[i]); //定义$div为 $(subDivs[i]
if($div.find("input[type=checkbox]:checked").length>0){//如果有checkbox中有 checked 属性
keys+=$div.attr("parentKey")+","; //获取到 $div的parentKey属性 并进行拼接
$.each($div.find("input[type=checkbox]:checked"),function(){// 为每个有checked属性的$div调用函数
keys+=$(this).attr("moduleKey")+","; 获取到$div的moduleKey属性 并进行拼接
})
}
}
keys=keys.substr(0,keys.length-1);// 去掉逗号
return keys;
}
本文介绍了jQuery中attr(), substr(), .prop() 和 each() 方法的基本用法及其应用场景。详细解释了如何使用attr()和.prop()来读取和设置HTML元素的固有属性与自定义属性,并通过实例展示了each()方法的应用。

被折叠的 条评论
为什么被折叠?



