首页 > 代码库 > javascript DOM基本操作
javascript DOM基本操作
javascript DOM基本操作
1.DOM(Document Object Model 文档对象模型)
2.节点:
- 文档节点:document
- 元素节点:html、head、body、title、meta、h1、p等
- 属性节点:attr
- 文本节点:text
2.1节点获取
- documen.getElementById("元素ID") //返回含有该ID的元素
- document.getElementsByName("元素name属性") //返回带有指定名称元素的集合
- document.getElementsByTagName("元素标签") //返回指定元素的集合
2.2属性节点处理
- elementNode.hasAttribute("attrName") // 检测所选元素是否有attrName属性 eg:documen.getElementById("nav").hasAttribute("class")
- elementNode.getAttribute("attrName") //获取元素attrName属性的值
- elementNode.setAttribute("attrName","attrValue") //设置属性,创建或改变元素属性值
- elementNode.removeAttribute("attrName") //移除属性
- 注意:在获取属性和移除属性时,用hasAttribute()方法判断此属性是否存在
2.3文本节点处理
- 通过innerHTML属性获取和设置文本节点属性
- documen.getElementById("content").innerHTML="<p>hello!</p>"
3遍历DOM
- 父节点.firstChild //获取元素的首个子节点
- 父节点.lastChild //获取元素最后一个子节点
- 父节点.childNode //获取元素子节点列表
- 子节点.parentNode // 获取已知节点父节点
- 兄弟节点.previousSibling //获取已知节点前一个节点
- 兄弟节点.nextSibling //获取已知节点后一个节点
4.节点操作
javascript DOM基本操作
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。