用新HTML替换childNodes textNodes(url replacer)

时间:2014-01-02 19:45:13

标签: javascript html replace removechild

我需要一些小而紧凑的所以我一直在做这样的试验,我有一些工作稍微有点,只是出于某些原因它实际上没有附加新的HTML ......

 var a = document.querySelectorAll('.post .content div');
 var b = a[7].childNodes;
 for(i=0;i<b.length;i++){
  var exp = /(\b(https?|ftp|file):\/\/[\-A-Z0-9+&@#\/%?=~_|!:,.;]*[\-A-Z0-9+&@#\/%=~_|])/ig;
   if(b[i].nodeType === 3){
     var ahref = document.createElement('a');
         ahref.className="easyBBurlFetch";
         ahref.href=b[i].nodeValue.replace(exp,'$1');
         ahref.innerText=b[i].nodeValue.replace(exp,'$1');
     b[i].parentNode.insertBefore(ahref,b[i]);
     b[i].parentNode.removeChild(b[i]);
    }
  }

Testing Fiddle

1 个答案:

答案 0 :(得分:1)

尝试将最后一行更改为b[i].parentNode.removeChild(b[i].nextSibling);,因为您使用当前的一行删除了您在上一步中添加的相同元素。原因是childNodes返回实时集合,当您向同一个parentNode添加元素时,元素@ b [i]不是文本节点,而是它刚刚添加的锚点。而且在处理实时收集缓存之前的长度:

 var a = document.querySelectorAll('.post .content div');
 var b = a[0].childNodes;

 for(i=0, l=b.length;i<l;i++){ //Cache the length here in variable l
  var exp = /(\b(https?|ftp|file):\/\/[\-A-Z0-9+&@#\/%?=~_|!:,.;]*[\-A-Z0-9+&@#\/%=~_|])/ig;
   if(b[i].nodeType === 3){
      ...........
     b[i].parentNode.insertBefore(ahref,b[i]);
     b[i].parentNode.removeChild(b[i].nextSibling); //remove the next element to the added element
     //Or
     //b[i].parentNode.removeChild(b[i+1]);
    }
  }