以文本方式查看主题

-  计算机科学论坛  (http://bbs.xml.org.cn/index.asp)
--  『 DOM/SAX/XPath 』  (http://bbs.xml.org.cn/list.asp?boardid=11)
----  DOM为什么没有定义insertAfter()这样的函数?  (http://bbs.xml.org.cn/dispbbs.asp?boardid=11&rootid=&id=45404)


--  作者:flyfoxs
--  发布时间:4/13/2007 11:18:00 PM

--  DOM为什么没有定义insertAfter()这样的函数?
这是DOM对应的官方文档:
http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/level-one-core.html

我发现里面有insertBefore和appendChild这两个函数。但却没有insertAfter这个函数
insertBefore:给出一个元素,然后插入一个元素到这个元素之前(这两个元素是兄弟关系)

appendChild:给出一个元素,然后插入一个元素到当前这个元素的子节点,并且是插入到子节点的最后。(这两个元素是父子关系)

但如果我已经寻址到一个元素了,我想插入一个兄弟元素到这个元素的后面,DOM模型却没有提供对应的方法,要自己实现。我觉得这个问题,作为一个基础的函数库,好像是有一定问题的?

难道是有其它我没有想到的原因?


--  作者:Qr
--  发布时间:4/14/2007 9:50:00 AM

--  
实际偶觉得基本上够用了,insertAfter无所谓了,只是还有那么点欠缺。
insertAfter的功能实际上可以用insertBefore来实现,
currNode.parentNode.appendChild(newNode)这个用法也基本上避免了二次寻址的麻烦。
--  作者:flyfoxs
--  发布时间:4/14/2007 1:14:00 PM

--  
currNode.parentNode.appendChild(newNode)这个用法也基本上避免了二次寻址的麻烦。
假设有下面几个节点

1
2
3
4
5

如果你要在3之后插入一个节点A,你就会非常郁闷了。

你要先往下找到4这个节点,然后再插入A。

如果恰好3就是最后一个节点,就会出错,这时你要进行if判断,看是不是最后一个节点。

不知道我的意思讲的可清楚。


--  作者:Qr
--  发布时间:4/14/2007 8:29:00 PM

--  
的确,如果已经寻址到第3个节点,要在其后插入一个节点挺让人郁闷的
--  作者:windstamp
--  发布时间:6/8/2007 4:29:00 PM

--  
// 将newElement元素插入targetElement元素之后
function insertAfter(newElement, targetElement) {
 var parent = targetElement.parentNode;
 if(parent.lastChild == targetElement) {
  parent.appendChild(newElement);
 } else {
  parent.insertBefore(newElement, targetElement.nextSibling);
 }
}
--  作者:flyfoxs
--  发布时间:6/25/2007 9:21:00 PM

--  
以下是引用windstamp在2007-6-8 16:29:00的发言:
// 将newElement元素插入targetElement元素之后
function insertAfter(newElement, targetElement) {
  var parent = targetElement.parentNode;
  if(parent.lastChild == targetElement) {
   parent.appendChild(newElement);
  } else {
   parent.insertBefore(newElement, targetElement.nextSibling);
  }
}


我以前也通过编程实现过这个方法,但没有你写的这么简单易懂。

楼上的功底真不错。


--  作者:flyfoxs
--  发布时间:8/30/2007 4:35:00 PM

--  
http://docs.jquery.com/DOM/Manipulation

在jQuery库中提供了这个方法,虽然这个方法自己写也不难,既然有现存的,能够复用还是比较好的。

并且这个库也确实很不错。


--  作者:yqh860921
--  发布时间:11/5/2007 11:44:00 AM

--  
支持flyfoxs,jquery中这个方法已经实现了
W 3 C h i n a ( since 2003 ) 旗 下 站 点
苏ICP备05006046号《全国人大常委会关于维护互联网安全的决定》《计算机信息网络国际联网安全保护管理办法》
78.125ms