JSLite - 节点属性

收藏581

阅读9466

更新时间2022-04-11

如有疑问欢迎到这些地方交流,欢迎加入JSLite.io组织团伙共同开发!

pluck

获取对象集合中每一个元素的属性值。

$("#box").pluck("nodeName") //⇒ ["DIV"]
$("#box").pluck("nextElementSibling") //⇒ 1234567890
$("#box").pluck("children") //⇒ [HTMLCollection[4]]

attr

读取或设置dom的属性。

$(".button").attr({"class":"","style":"background:red"}) //⇒ self 设置红色清空class
$(".button").attr("class","name")  //⇒ self 设置class替换之前的
$(".button").attr("class")  //⇒ string 获取class属性值

removeAttr

移动当前对象集合中所有元素的指定属性。

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

prop

读取或设置dom的属性。它在读取属性值的情况下优先于 attr,因为这些属性值会因为用户的交互发生改变,如 checkedselected



$("#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

为集合中匹配的元素删除一个属性(property)。removeProp() 方法用来删除由.prop()方法设置的属性集。

注意: 不要使用此方法来删除原生的属性( property ),比如checked, disabled, 或者 selected。这将完全移除该属性,一旦移除,不能再次被添加到元素上。使用.prop()来设置这些属性设置为false代替。

CodePlayer

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"

相关

视频

RELATED VIDEOS

更多

免费

Web前端开发极速入门
初级 Web前端开发极速入门

219920次学习

收藏

免费

前端入门_HTML5
初级 前端入门_HTML5

616946次学习

收藏

免费

30分钟学会网站布局
初级 30分钟学会网站布局

238440次学习

收藏

免费

CSS视频教程-玉女心经版
初级 CSS视频教程-玉女心经版

393054次学习

收藏

免费

独孤九贱(1)_HTML5视频教程

免费

独孤九贱(6)_jQuery视频教程

免费

独孤九贱(7)_Bootstrap视频教程

免费

独孤九贱(2)_CSS视频教程
初级 独孤九贱(2)_CSS视频教程

229605次学习

收藏

科技资讯

更多

精选课程

更多
前端入门_HTML5
前端入门_HTML5

共29课时

61.9万人学习

CSS视频教程-玉女心经版
CSS视频教程-玉女心经版

共25课时

39.4万人学习

JavaScript极速入门_玉女心经系列
JavaScript极速入门_玉女心经系列

共43课时

71.1万人学习

独孤九贱(1)_HTML5视频教程
独孤九贱(1)_HTML5视频教程

共25课时

61.8万人学习

独孤九贱(2)_CSS视频教程
独孤九贱(2)_CSS视频教程

共22课时

23万人学习

独孤九贱(3)_JavaScript视频教程
独孤九贱(3)_JavaScript视频教程

共28课时

34万人学习

独孤九贱(4)_PHP视频教程
独孤九贱(4)_PHP视频教程

共89课时

125.5万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号