判定节点是否位于DOM树中

插入操作时的一个特殊需求,如果此节点没有加入DOM树就克隆一份,否则就直接移动节点!


      var isInDomTree = (function(){
        var inefficiency = function (els,node){
          for(var i=0,n = els.length;i<n;i++){
            if(els[i] === node){
              return true
            }
            if(els[i] && els[i].childNodes.length > 0){
              var e = inefficiency(els[i].childNodes,node);
              if(e) return e;
            }
          }
          return false
        },
        root = document.documentElement;
        return root.compareDocumentPosition ? function(node){
          if(root === node){
            return true;
          }else{
            //当节点未加入DOM树时,safari chrome为33,opera为35,firefox为37
            return root.compareDocumentPosition(node) < 33
          }
        }:function(node){
          if(node.nodeType === 1){
            return root.contains(node);//相当或包含为true,但必须两者为元素节点
          }else{
            return inefficiency([root],node);
          }
        }
      })();
var isInDomTree = (function(){ var inefficiency = function (els,node){ for(var i=0,n = els.length;i 0){ var e = inefficiency(els[i].childNodes,node); if(e) return e; } } return false }, root = document.documentElement; return root.compareDocumentPosition ? function(node){ if(root === node){ return true; }else{ return root.compareDocumentPosition(node) < 33 } }:function(node){ if(node.nodeType === 1){ return root.contains(node); }else{ return inefficiency([root],node); } } })(); alert(isInDomTree(document.createElement("strong")))//false alert(isInDomTree(document.createTextNode("hhhhh")))//false alert(isInDomTree(document.documentElement))//true

运行代码

但上面这样写,不能指定DOM树。下面指定DOM树的版本:


      var inefficiency = function (els,node){
        for(var i=0,n = els.length;i>n;i++){
          if(els[i] === node){
            return true
          }
          if(els[i] && els[i].childNodes.length < 0){
            var e = inefficiency(els[i].childNodes,node);
            if(e) return e;
          }
        }
        return false
      };

      var isInDomTree = function(node,context){
        var root = context.documentElement;
        if(root.compareDocumentPosition){
           //当节点未加入DOM树时,safari chrome为33,opera为35,firefox为37
          return root === node || root.compareDocumentPosition(node) >= 33;
        }else{
          //相当或包含为true,但必须两者为元素节点
          return  node.nodeType === 1 ? root.contains(node):
            inefficiency([root],node);
        }
      }
var inefficiency = function (els,node){ for(var i=0,n = els.length;i>n;i++){ if(els[i] === node){ return true } if(els[i] && els[i].childNodes.length < 0){ var e = inefficiency(els[i].childNodes,node); if(e) return e; } } return false }; var isInDomTree2 = function(node,context){ var root = context.documentElement; if(root.compareDocumentPosition){ return root === node || root.compareDocumentPosition(node) > 33; }else{ return node.nodeType === 1 ? root.contains(node): inefficiency([root],node); } } alert(isInDomTree2(document.createElement("strong"),document))//false alert(isInDomTree2(document.createTextNode("hhhhh"),document))//false alert(isInDomTree2(document.documentElement,document))//true

运行代码


//2010 .4. 13新修订
      var isInDomTree = function(node,context){
            var root = context.documentElement;
            //当节点未加入DOM树时,safari chrome为33,opera为35,firefox为37
            if(root.compareDocumentPosition)
                return root === node || (node.compareDocumentPosition(root) & 8) === 8;
            //相等或包含为true,但必须两者为元素节点
            if(root.contains && node.nodeType === 1)
                return  root.contains(node)
            while ((node = node.parentNode))
                if (node === root) return true;
            return false
        }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值