JavaScript基本DOM属性和操作(常用)

一、获取元素

getElementById();  //通过id值获取元素节点,返回一个节点对象
getElementByTagName();  //通过标签名获取元素节点,返回一个对象数组
getElementByClassName();  //通过类名获取元素节点,返回一个对象数组  注:HTML5 DOM中新增

二、获取和设置属性

object.getAttribute(attribute);  //获取属性值,如果没有则返回null
object.setAttribute(attribute, value);  //给属性设定值

三、节点属性

element.childNodes  //返回元素子节点的 NodeList

element.nodeType  //返回元素的节点类型
元素节点 的nodeType为 1
属性节点 的nodeType为 2
文本节点 的nodeType为 3

element.nodeValue  //设置或返回元素值,元素节点没有nodeValue值
element.firstChild  //等价于:element.childNodes[0]
element.lastChild  //等价于:element.childNodes[node.childNodes.length-1]

四、动态创建标记

element.innerHTML  //设置或返回元素的内容
document.createElement(nodeName);  //创建元素节点
parent.appendChild(child);  //插入元素节点
document.createTextNode(text);  //创建文本节点
element.insertBefore(node);  //现有的子元素之前插入一个新的子元素 注没有insertAfter

详细的DOM属性和操作可以在 菜鸟教程 查看

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容