2回答

• 

  慕无忌8527878

  2017-08-07 13:52:25

  不知道我这样写有没有什么问题，如果你能发现问题的话请告诉我一下哈，谢谢！

  <script type="text/javascript">
  function clearText() {
    var content=document.getElementById("content");
    // 在此完成该函数
    var x = content.children;
    for(let i = x.length - 1 ;i >=0 ;i--){
        content.removeChild(x[i]);
    }
    
  }
  </script>

  
  

  0 0
• 

  alias_neo3443231

  2017-06-21 09:35:02

  我已经搞懂了，自问自答，也算做个记录，并给后来学习的猿友提供点经验。

  function clearText() {
    var content=document.getElementById("content");
    // 在此完成该函数
    var childs = content.childNodes;
    console.log(childs);
    for(child of childs){
        content.removeChild(child);
    }
  }

  这段函数的问题在于，for of循环中，of后面跟的变量长度始终在变化，所以递归无法得到正确结果。

  那么很简单的方法是直接获取childs长度然后进行for循环，然而存在浏览器兼容性问题，因为列表长度不一致。

  于是换个思路，如果我把取到的childNode存起来呢？这样：

  function clearText() {
    let content=document.getElementById("content");
    let childs = content.childNodes;
    let buffers = childs;
    // 在此完成该函数
    for(let buffer of buffers){
    	content.removeChild(buffer);
    }
  }

  运行结果没有变化，可见childNodes存储的是一个指针列表，buffer指向的对象依然是原始目标，导致content的删除子节点影响buffers存储空间。

  那好，再变...

  function clearText() {
    let content=document.getElementById("content");
    let childs = content.childNodes;
    let buffers = Array.from(childs);
    // 在此完成该函数
    for(let buffer of buffers){
    	content.removeChild(buffer);
    }
  }

  这次运用了一个Array.from函数，这是es6新增函数，将对象存成数组。

  这次buffers彻底变成了数组，console.log可以看到，原型不再是NodeList而是Array。

  于是通关....

  发现我js基础不是一般的差>_<。泪

  0 0