JS DOM1核心概要1

节点:XML和HTML文档都是有节点构成的结构,每段标记都可以通过节点来表示;

节点类型:

元素节点(常用)

属性节点(常用)

文本节点

注释节点

文档节点

进程节点

文档类型节点

等...

了解节点的信息可以用nodeValuenodeName属性,这两个属性的取值完全有节点类型决定,文本节点的nodeValue为文本节点的文本内容,常用它来获取某一节点的值,

元素节点的nodeName为元素名称,nodeValue为空;

ex:

  if(someNode.nodeType==1){

    alert(someNode.nodeName);//弹出元素节点的元素值

  }

家族式节点关系:

节点的childNodes属性,该属性内包含nodelist对象,用于保存一组有序的节点对象(子节点对象),可以通过方括号语法来访问;nodelist可以通过length属性获取其节点长度;

在文档中childNodes的节点中常常包含空白元素节点,所以在用childNodes遍历子元素时通常需要判断其节点类型;

ex:

  var firstnode=someNode.childNodes[0];

  var len=someNode.childNodes.length;

节点的parentNode属性,该属性指向文档树中的父节点,包含在childNodes中的所有的节点都有一个共同的parentNode,childNodes节点之间是同胞关系,可以通过每个节点的previousSibling和nextSibling来访问同一列表中的其他节点,其中childNodes.firstChild代表第一个子节点,childNodes.lastChild代表最后一个子节点;

操作节点:

appendChild:向chileNodes的末尾添加一个节点。返回新增节点;

ex:

  var returnNode=childNodes.appendChild(newNode);

  alert(returnNode==newNode);//true

removeChild:移除某个节点,结果返回被移除的节点;

ex:

  var someNodeFirstnode=childNodes.removeChild(someNode.firstChild);

insertBefore:向chileNodes某个元素之前添加子节点,需要两个参数(newNode,someNode);

relpaceChild:替换某个节点,需要两个参数(newNode,someNode),返回被替换后的节点;

cloneNode:复制某个节点,参数为true时表示深度复制;

原文地址:https://www.cnblogs.com/lvlina/p/5885046.html