乐趣区

关于node.js:node节点是什么有哪些神操作

1.node 节点 (更具体的获取(设置) 页面中所有的内容)

依据 W3C 的 HTML DOM 规范,HTML 文档中的所有内容都是节点:

元素是节点的别称,节点蕴含元素当然节点还有好多细化的品种;

有元素节点、属性节点、文本节点 …….

节点的关系从这里真正的体现进去

根节点:root>>>>HTML 没有父节点;

节点操作:(通过父子系关系)

childNodes:获取以后元素的所有子节点;

nodeType: 节点品种,返回值是数字;

nodeValue: 获取 (文字) 节点的文本内容;

nodeName:返回 node 节点名称(#text,正文,标签 ….);

一个能够找出元素节点的办法;

常见的节点类型:

1 元素(div、body、li、span …….)

2* 属性代表属性节点 (class,src,href)

3 文本节点(text 节点)

8 代表正文节点

9 代表 document 节点;

2.innerHTML 和 nodeValue;(当 innerHTML 和 nodeValue 别离作为左值的时候)

box.innerHTML = ‘< strong >abc< /strong >’;

box.childNodes[0].nodeValue = ‘< strong >abc< /strong >’;

innerHTML 会将标签解析;

nodeValue 不会进行解析,会将标签名转译成字符串,间接输入;

3.attribute 属性

document.getElementById(‘box’).attributes // 获取所有,该节点的属性信息;

document.getElementById(‘box’).attributes.length;// 返回属性节点个数

document.getElementById(‘box’).attributes[0]; // 返回第一个属性节点

document.getElementById(‘box’).attributes[0].nodeType; //2,属性

document.getElementById(‘box’).attributes[0].nodeValue; // 属性值

document.getElementById(‘box’).attributes[‘id’]; // 返回属性为 id 的节点

document.getElementById(‘box’).attributes.getNamedItem(‘id’); // 获取 id 的节点;

个别只用作获取;

4. 节点操作

DOM 不仅仅能够获取设置节点,还能够创立,删除,复制、插入、替换节点;

write()办法,是写入,和 innerHTML 相似;

node 三剑客

()创立一个节点;

var oDiv=document.(‘div’)

createTextNode()创立一个文字节点;

var oText=document.createTextNode(‘dddd’);

oDiv.(oText) 将一个节点插入到另一个节点上;

box.insertBefore(newNode, existNode) 把 new node 插入到 existNode 之前;

oDiv.insertBefore(document.createTextNode(‘eeeeee’),oDiv.childNodes[0]) ;

box.removeChild(oText) 删除节点

++ 定位

offsetParent 这个属性的返回值是它依据谁定位的,如果它的所有父元素都没有定位,那么返回 body

offsetLeft 这个属性返回元素的左侧偏移值;

offsetTop 这个属性返回元素的右侧偏移值;

获取元素绝对于窗口的相对定位;

获取决定定位的函数封装:

5. 替换操作

var p=document.(‘p’)

oDiv.parentNode.replaceChild(p,oDiv);

6. 复制节点

var oDiv=document.getElementById(‘box’);

var clnotallow=oDiv.cloneNode(true);

oDiv.(clone)

console.log(clone)

7. 遍历节点(依据某一个节点地位找到它的父子、兄弟节点)

父子节点:

兄弟节点:

父 (parent)、子(child) 和同胞 (sibling) 等术语用于形容这些关系。父节点领有子节点。同级的子节点被称 为同胞(兄弟或姐妹)。

childNodes 获取以后元素节点的所有子节点

firstChild 获取以后元素节点的第一个子节点

lastChild | lastElementChild 获取以后元素节点的最初一个子节点

ownerDocument 获取该节点的文档根节点,相当与 document

parentNode 获取以后节点的父节点

previousSibling 获取以后节点的前一个同级节点

nextSibling 获取以后节点的后一个同级节点

退出移动版