[b]DOM结构[/b]——两个节点之间可能存在哪些关系以及如何在节点之间任意移动？
document.documentElement 返回文档的根节点<html>
document.body <body>
document.activeElement 返回当前文档中被击活的标签节点(IE)
event.fromElement 返回鼠标移出的源节点(IE)
event.toElement 返回鼠标移入的源节点(IE)
event.srcElement 返回激活事件的源节点(IE)
event.target 返回激活事件的源节点(firefox)
[b]当前对象为node：[/b]
返回父节点：node.parentNode， node.parendElement(IE)
返回所有子节点：node.childNodes（包含文本节点及标签节点）,node.children
返回第一个子节点：node.firstChild
返回最后一个子节点： node.lastChild
返回下一个兄弟节点：node.nextSibling
返回上一个兄弟节点：node.previousSibling
parentNode和parentElement功能一样，childNodes和children功能一样。但是parentNode和 childNodes是符合W3C标准的，可以说比较通用。而另外两个只是IE支持，不是标准，Firefox 就不支持，所以大家只要记得有parentElement和children就行了
[b]节点的操作：[/b]
创建节点： document.createElement("div");//好像大都只能用document，不知道还能换成什么
创建节点： document.createTextNode("fdsafdas");
还有一个创建节点碎片： document.createDocumentFragment();（可以用来减少页面多次刷新，上篇文章有详细说过）
[b]常用的添加节点：[/b]
pnode.appendChild(node);//在节点pnode的子节点后追加node子节点
pnode.insertBefore(newChild, oldChild);//在现有的子节点前插入一个新的子节点
//newChild作为的pnode的子节点插入到其子节点oldChild之前，oldChild为可选项参数， 当为null时其效果与appendChild一样，记住这句话，两个参数就不会记倒了，这里注意可没有node.insertAfter()，只能自己定义
[b]删除节点：[/b] pnode.removeChild(node)
[b]复制节点：[/b] pnode.cloneNode(include_all); //include_all为true时，则同时复制所有子节点，为false时，则只复制该节点（注意id也会被复制）
[b]替换节点：[/b] pnode.replaceChild(newnode,oldchild)
[b]访问节点：[/b]
访问html元素：var oHtml=document.documentElement;
获取head元素：var oHead=oHtml.firstChild;
获取body元素：var oBody=oHtml.lastChild; 或者 var oBody=document.body;
也可以通过childNodes来做同样的工作：
var oHead=oHtml.childNodes[0] 或者 oHtml.childNodes.item(0);
var oBody=oHtml.childNodes[1] 或者 oHtml.childNodes.item(1);
[b]判断节点间关系：[/b]
alert(oHead.parentNode==oHtml);
alert(oBody.previousSibling==oHead);
alert(oHead.nextSibling==oBody);
alert(oHead.ownerDocument==document);
[b]访问指定节点：[/b]
熟知的getElementsByTagName(name),getElementsByName(name),getElementById(id)三个方法，不再展开。
[b]属性操作：[/b]
getAttribute(name) ——返回名称为name的属性的值
setAttribute(name,value) ——顾名思义
removeAttribute(name) ——顾名思义
为了简化创建表格，HTML DOM提供了一系列的表格方法，常用几个：
cells ——返回</tr>元素中的所有单元格
rows ——表格中所有行的集合
insertRow(position) ——在rows集合中指定位置插入新行
deleteRow(position) ——与insertRow相反
insertCell(position) ——在cells集合的指定位置插入一个新的单元格
deleteCell(position) ——与insertCell相反
document.documentElement 返回文档的根节点<html>
document.body <body>
document.activeElement 返回当前文档中被击活的标签节点(IE)
event.fromElement 返回鼠标移出的源节点(IE)
event.toElement 返回鼠标移入的源节点(IE)
event.srcElement 返回激活事件的源节点(IE)
event.target 返回激活事件的源节点(firefox)
[b]当前对象为node：[/b]
返回父节点：node.parentNode， node.parendElement(IE)
返回所有子节点：node.childNodes（包含文本节点及标签节点）,node.children
返回第一个子节点：node.firstChild
返回最后一个子节点： node.lastChild
返回下一个兄弟节点：node.nextSibling
返回上一个兄弟节点：node.previousSibling
parentNode和parentElement功能一样，childNodes和children功能一样。但是parentNode和 childNodes是符合W3C标准的，可以说比较通用。而另外两个只是IE支持，不是标准，Firefox 就不支持，所以大家只要记得有parentElement和children就行了
[b]节点的操作：[/b]
创建节点： document.createElement("div");//好像大都只能用document，不知道还能换成什么
创建节点： document.createTextNode("fdsafdas");
还有一个创建节点碎片： document.createDocumentFragment();（可以用来减少页面多次刷新，上篇文章有详细说过）
[b]常用的添加节点：[/b]
pnode.appendChild(node);//在节点pnode的子节点后追加node子节点
pnode.insertBefore(newChild, oldChild);//在现有的子节点前插入一个新的子节点
//newChild作为的pnode的子节点插入到其子节点oldChild之前，oldChild为可选项参数， 当为null时其效果与appendChild一样，记住这句话，两个参数就不会记倒了，这里注意可没有node.insertAfter()，只能自己定义
[b]删除节点：[/b] pnode.removeChild(node)
[b]复制节点：[/b] pnode.cloneNode(include_all); //include_all为true时，则同时复制所有子节点，为false时，则只复制该节点（注意id也会被复制）
[b]替换节点：[/b] pnode.replaceChild(newnode,oldchild)
[b]访问节点：[/b]
访问html元素：var oHtml=document.documentElement;
获取head元素：var oHead=oHtml.firstChild;
获取body元素：var oBody=oHtml.lastChild; 或者 var oBody=document.body;
也可以通过childNodes来做同样的工作：
var oHead=oHtml.childNodes[0] 或者 oHtml.childNodes.item(0);
var oBody=oHtml.childNodes[1] 或者 oHtml.childNodes.item(1);
[b]判断节点间关系：[/b]
alert(oHead.parentNode==oHtml);
alert(oBody.previousSibling==oHead);
alert(oHead.nextSibling==oBody);
alert(oHead.ownerDocument==document);
[b]访问指定节点：[/b]
熟知的getElementsByTagName(name),getElementsByName(name),getElementById(id)三个方法，不再展开。
[b]属性操作：[/b]
getAttribute(name) ——返回名称为name的属性的值
setAttribute(name,value) ——顾名思义
removeAttribute(name) ——顾名思义
为了简化创建表格，HTML DOM提供了一系列的表格方法，常用几个：
cells ——返回</tr>元素中的所有单元格
rows ——表格中所有行的集合
insertRow(position) ——在rows集合中指定位置插入新行
deleteRow(position) ——与insertRow相反
insertCell(position) ——在cells集合的指定位置插入一个新的单元格
deleteCell(position) ——与insertCell相反
1498
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
