JSLite - 節(jié)點(diǎn)屬性

2018-12-07 00:35 更新

如有疑問歡迎到這些地方交流,歡迎加入JSLite.io組織團(tuán)伙共同開發(fā)!

segmentfault社區(qū) | 官方網(wǎng)站 | 官方文檔-更詳細(xì) | Issues

pluck

獲取對(duì)象集合中每一個(gè)元素的屬性值。

$("#box").pluck("nodeName") //? ["DIV"]
$("#box").pluck("nextElementSibling") //? <div class="boxs">1234567890</div>
$("#box").pluck("children") //? [HTMLCollection[4]]

attr

讀取或設(shè)置dom的屬性。

$(".button").attr({"class":"","style":"background:red"}) //? self 設(shè)置紅色清空class
$(".button").attr("class","name")  //? self 設(shè)置class替換之前的
$(".button").attr("class")  //? string 獲取class屬性值

removeAttr

移動(dòng)當(dāng)前對(duì)象集合中所有元素的指定屬性。

$("#box").removeAttr("class") //? self 移除class

prop

讀取或設(shè)置dom的屬性。它在讀取屬性值的情況下優(yōu)先于 attr,因?yàn)檫@些屬性值會(huì)因?yàn)橛脩舻慕换グl(fā)生改變,如 checkedselected 。

<input class="taiyang" id="check1" type="checkbox" checked="checked">
<input class="yaotaiyang" id="check2" type="checkbox">

$("#check1").attr("checked"); //=> "checked"
$("#check1").prop("checked"); //=> "true"
$("#check2").attr("checked"); //=> "false"
$("#check2").prop("checked"); //=> "false"
$("input[type="checkbox"]").prop("type",function(index,oldvalue){
console.log(index+"|"+oldvalue);
});
//=> 0|checkbox
//=> 1|checkbox
$("input[type="checkbox"]").prop("className",function(index,oldvalue){
console.log(index+"|"+oldvalue);
});
//=> 0|taiyang
//=> 1|yaotaiyang

removeProp

為集合中匹配的元素刪除一個(gè)屬性(property)。removeProp() 方法用來(lái)刪除由.prop()方法設(shè)置的屬性集。

注意: 不要使用此方法來(lái)刪除原生的屬性( property ),比如checked, disabled, 或者 selected。這將完全移除該屬性,一旦移除,不能再次被添加到元素上。使用.prop()來(lái)設(shè)置這些屬性設(shè)置為false代替。

<p id="n2" class="demo test" data-key="UUID" data_value="1235456465">CodePlayer</p>


var $n2 = $("#n2");
$n2.prop("prop_a", "CodePlayer");
$n2.prop("prop_b", { name: "CodePlayer", age: 20 } );


console.log($n2.prop("prop_a")) //? CodePlayer
console.log($n2.prop("prop_b")) //? Object {name: "CodePlayer", age: 20}


$n2.removeProp("data-key");
$n2.prop("data-key") //? undefined
$n2.attr("data-key") //? "UUID"

以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)