1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > js获取属性值 自定义属性 修改移除属性值

js获取属性值 自定义属性 修改移除属性值

时间:2018-10-26 14:05:53

相关推荐

js获取属性值 自定义属性 修改移除属性值

补充:由于不清楚一些属性是内置属性还是自定义属性 所以h5规定 自定义属性使用date-开头作为属性并赋值

案例1:

<body><div date-index="1"></div></body><script>var div = document.querySelector('div');console.log(div.getAttribute('date-index')); //打印为1</script>

注:如果是自定义属性(自己给的属性)建议使用element.getAttribute('属性')或者,如果是元素本身自带属性(如id),就使用element.属性

一.获取属性值

element.属性

获取内置属性(元素本身自带的属性

element.getAttribute('属性')//get 得到获取 attribute 属性

主要获得自定义属性 程序员自己添加的属性 被称为自定义属性

案例:获取div盒子属性的id 比如index=‘1’ 就是我们i自己定义的属性

<body><div id="demo" index="1"></div><script>var div = document.querySelector('div');console.log(div.id);console.log(div.getAttribute('id'));console.log(div.getAttribute('index'));</script></body>

二.自定义属性 设置属性值

element.属性 = ‘值’;

案例1:修改属性id

<body><div id="demo" index="1"></div><script> var div = document.querySelector('div');div.id = 'text'; //设置内置属性值</script></body>

案例2:修改元素的类名 使用className

<body><div id="demo" index="1" class="box"></div><script>var div = document.querySelector('div');div.id = 'text'; //设置内置属性值div.className = 'boxs'; //修改类名</script></body>

element.setAttribute('属性', '值');

案例:修改自定义属性的值 index和class都是自己定义的属性

<body><div id="demo" index="1" class="box"></div><script>div.setAttribute('index', 2);div.setAttribute('class', 'nav');</script></body>

三.移除属性值

element.removeAttribute('属性');

案例:比如不想要index了 移除index属性

<body><div id="demo" index="1" class="box"></div><script>var div = document.querySelector('div');//移除属性div.removeAttribute('index')</script></body>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。