JavaScript DOM编程艺术
我最近看这个,看到动态创建html;介绍的insertBefore函数,没有insertAfter函数,然后作者便自己创建一个insertAfter函数,代码如下
function insertAfter(newElement,targetElement) {
var parent = targetElement.parentNode;
if (parent.lastChild == targetElement) {
parent.appendChild(newElement);
} else {
parent.insertBefore(newElement,targetElement.nextSibling);
}
}
我的问题在这个lastChild上
比如:
<body>
<p id="test">xxx</p>
</body>
var pObj=document.getElementById("test");
然后我创建一个元素对象A,要插在pObj后
insertAfter(A,pObj);
pObj.parentNode是body,body的lastChild应该是文本节点xxx才对。也就是说对象A应该插在元素节点与文本节点之间。但是书中效果又不是这样的。有没有人看过这个函数,怎么理解的?
我最近看这个,看到动态创建html;介绍的insertBefore函数,没有insertAfter函数,然后作者便自己创建一个insertAfter函数,代码如下
function insertAfter(newElement,targetElement) {
var parent = targetElement.parentNode;
if (parent.lastChild == targetElement) {
parent.appendChild(newElement);
} else {
parent.insertBefore(newElement,targetElement.nextSibling);
}
}
我的问题在这个lastChild上
比如:
<body>
<p id="test">xxx</p>
</body>
var pObj=document.getElementById("test");
然后我创建一个元素对象A,要插在pObj后
insertAfter(A,pObj);
pObj.parentNode是body,body的lastChild应该是文本节点xxx才对。也就是说对象A应该插在元素节点与文本节点之间。但是书中效果又不是这样的。有没有人看过这个函数,怎么理解的?
解决方案 »
- 散分..今天上班了..
- 怎么控制在一个客户端只能打开一个相同的网站?
- JS小问题
- jsp省市联动+验证码!
- 请教:怎样把数据库里的数据放到编辑器里,下面放不进去。编辑器都是用js控制的
- extjs4 treepanel刷新后,如何保持选中状态。
- 再问:iframe 调用远程文件界面自适应高度
- 如何实现:当打开一个页面时,如何让一个隐藏的层(装着小图片)显示在页面某一位置(该位置坐是动态变化的),当鼠标移动到该层时,该层
- 能不能在打开网页的时候让他运行网站里的bat文件
- easyui返回数据为空时,会发出 2次请求加载数据问题
- 有谁会用jquery datatable吗?怎么现实动态分页?
- 求指导一个关于闭包的问题
所以lastChid是p元素 或者p后边的空白文本(和浏览器有关)
lastChild只会计算子节点 不会计算后代节点的
不过,分析看来,如果源码换行了,(body的>和p的<没有直接接上,而是出现换行或空格),那么实际中间有一个textNode节点的。也就是说body其实有3个子节点,
body
├─textNode
├─p
│ └─textNode(nodeValue=XXX)
└─textNode因此,p不是body的lastChild,最后那个textNode才是!
然而一般空的textNode对我们根本没有意义,现代浏览器引入了lastElementChild。在没有这个属性的浏览器上,只能通过previousSibling然后判断nodeType逐一来排除textNode了找到我们要的Element。类似的有firstChild,previousSibling,nextSibling,在现代浏览器中都有其Element版本。