首页 > 代码库 > js获取节点的DOM操作
js获取节点的DOM操作
一直感觉DOM节点什么的乱七八糟的不能理解,可能博客也没办法写清楚,只能把知道的一些信息大致写下来慢慢再补充了。
HTML DOM类型
Node类型
Javascript中的所有节点类型都继承自Node类型,因此所有节点类型都共享着相同的基本属性和方法。
除IE外其他浏览器都可以访问到这个类型。
每个节点都有一个NodeType属性,用于表明节点的类型,节点类型由在Node类型中定义的下列12个常数值来表示,任何节点类型必居其一。
根据这些常量值可以很容易的判断节点类型。
if(someNode.nodeType == Node.ELEMENT_NODE){//IE无效 alert("Node is an element!"); }
if(someNode.nodeType == 1){ //所有浏览器有效 alert("Node is an element!"); }
- Node.ELEMENT_NODE(1); 元素节点
- NOde.ATTRIBUTE_NODE(2); 节点属性
- Node.TEXT_NODE(3); 文本节点
- Node.CDATA_SECTION_NODE(4); CDATA区域中的内容
- Node.ENTITY_REFERENCE_NODE(5);
- Node.ENTITY_NODE(6);
- Node.PROCESSING_INSTRUCTION_NODE(7);
- Node.COMMENT_NODE(8); 注释的文本节点
- Node.DOCUMENT_NODE(9); document节点
- Node.DOCUMENT_TYPE_NODE(10);
- Node.DOCUMENT_FRAGMENT_NODE(11); document片段
- Node.NOTATION_NODE(12);
JS操作DOM节点操作:
添加节点:
appendChild():通过把一个节点增加到当前节点的childNodes[]组,给文档树增加节点。
复制节点:
cloneNode():复制当前节点,或者复制当前节点以及它的所有子孙节点。
判断是否拥有该节点:
hasChildNodes():如果当前节点拥有子节点,则将返回true。
插入节点:
insertBefore():给文档树插入一个节点,位置在当前节点的指定子节点之前。如果该节点已经存在,则删除之再插入到它的位置。
删除节点:
removeChild():从文档树中删除并返回指定的子节点。
替换节点:
replaceChild():从文档树中删除并返回指定的子节点,用另一个节点替换它。
DOCUMENT类型:
查找节点:
getElementById()
getElementByTagName()
getElementByClassName()
js获取节点的DOM操作
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。