【JavaScript】41_DOM编程：属性节点

最新推荐文章于 2024-09-22 11:17:00 发布

名之以父

最新推荐文章于 2024-09-22 11:17:00 发布

阅读量322

点赞数

分类专栏： JavaScript 文章标签： javascript 前端 node.js react.js vue.js

本文链接：https://blog.csdn.net/wujianrenn/article/details/129613893

版权

JavaScript 专栏收录该内容

45 篇文章 1 订阅

订阅专栏

文章介绍了在DOM中如何操作属性节点，包括通过元素直接访问属性如type，使用getAttribute和setAttribute进行读写操作，以及用removeAttribute删除属性。示例代码展示了对input元素的type属性读取、设置value和disable属性的过程。

摘要由CSDN通过智能技术生成

6、属性节点

属性节点（Attr）

在DOM也是一个对象，通常不需要获取对象而是直接通过元素即可完成对其的各种操作
如何操作属性节点 ?

方式一：

读取：元素.属性名（注意，class属性需要使用className来读取）

读取一个布尔值时，会返回true或false

修改：元素.属性名 = 属性值

方式二：

读取：元素.getAttribute(属性名)

修改：元素.setAttribute(属性名, 属性值)

删除：元素.removeAttribute(属性名)

 <body>
     <input class="a" type="text" name="username" id="admin">
 
     <script>
         // const input = document.getElementsByName('uesrname')
         const input = document.querySelector('[name=username]')
         console.log(input.type)
 
         console.log(input.getAttribute('type'))
 
         input.setAttribute('value','孙悟空')
         input.setAttribute('disable','disable')
     </script>
 </body>