/** * 属性 * childNodes 子节点 * nextSibling 下一个节点 * previousSibling 上一个节点 * parentNode 父节点 * firstChild 第一个子节点 * lastChild 最后一个子节点 * hasChildNodes 判断是否有子节点 someNode.childNodes.length * ownerDocument 该节点所在的文档根document * body document.body 获取body属性 * documentElement document.documentElement 获取html属性 * doctype document.doctype 获取doctype的引用(浏览器支持的差异性这个属性很少用) * title document.title 获取title标签里面的内容 * URL document.URL 获取当前页面的完整URL * anchors document.anchors 获取带name属性的a元素 * * * 操作节点的方法(都必须获取到父节点的情况下才能操作) * appendChild(newNode) 在内尾部插入节点 someNode.appendChild(newNode) * insertBefore(newNode,thisNode) 在节点前插入节点 * replaceChild(newNode,thisNode) 替换节点 * removeChild(removeNode) 删除节点 * cloneNode(true/false) 复制节点 但是复制出来的节点没有父节点 someNode.cloneNode(true) * normalize() * getElementById() 根据id获取元素 * getElementsByTagName() 根据标签获取元素 * getElementsByName() 根据name获取元素 * write() 输出 * writeln() 输出(末尾加换行) */ //元素节点 nodeType == 1 属性节点nodeType == 2 var div = document.createElement('div'); div.innerHTML = 'create div'; document.body.appendChild(div); console.log(div.nodeType);//1 元素节点 console.log(div.firstChild.nodeValue);//文本节点中的value create div //文本节点 nodeType == 3 var element = document.createElement("div");//元素节点 element.className = "message";//属性 var testNode = document.createTextNode("Hello Word");//文本节点1 element.appendChild(testNode);//插入文本节点 var anotherTextNode = document.createTextNode("Yippee");//文本节点2 element.appendChild(anotherTextNode); console.log(element.childNodes.length);//2个文本节点 element.normalize();//合并两个文本节点 console.log(element.childNodes.length);//1个文本节点 document.body.appendChild(element);//body 里面插入元素节点 var newNode = element.firstChild.splitText(5);//分割文本节点 console.log(element.firstChild);//Hello console.log(newNode.nodeValue);//WordYippee console.log(element.childNodes.length);//2 //comment类型(注释类型) nodeType == 8 var comment = document.getElementById('myDiv'); console.log(comment.firstChild);//<!-- A comment --> console.log(comment.firstChild.data);//A comment //CDATASection类型 只针对于XML文档 nodeType == 4 //DocumentType类型 nodeType == 10 doctype //DocumentFragment类型(文档片段:代码存储仓库) nodeType == 11 var fragment = document.createDocumentFragment();//创建仓库 var ul = document.getElementById('myList'); var li = null; for(var i=0; i<3; i++){ li = document.createElement('li'); li.appendChild(document.createTextNode("Item " + (i+1))); fragment.appendChild(li); } ul.appendChild(fragment);