Question

在这个例子中，我开始切片一个数组。那很有效。然后我尝试切片用.children制作的阵列，但它没有用。如何在这样的例子中让一半孩子？

＆＃13;

var arr = ["One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight"];
console.log(arr.slice(4))

var childs = document.getElementById("container").children;
console.log(childs)
console.log(childs.slice(4));

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
  <p>unaffected</p>
  <p>unaffected</p>
  <p>unaffected</p>
  <p>unaffected</p>
  <p>affected</p>
  <p>affected</p>
  <p>affected</p>
  <p>affected</p>
 </div>

＆＃13;

Answer 1

var arr = ["One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight"];
console.log(arr.slice(4))

var childs = Array.from(document.getElementById("container").children);
console.log(childs);
console.log(childs.slice(4));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
  <p>unaffected</p>
  <p>unaffected</p>
  <p>unaffected</p>
  <p>unaffected</p>
  <p>affected</p>
  <p>affected</p>
  <p>affected</p>
  <p>affected</p>
 </div>

Answer 2

您无法直接删除，因为它们是Html元素

使用此代替或做Md Johirul Islam建议的内容的document.getElementById（＆＃34;容器＆＃34）。removeChild之（儿童的[4]）

Answer 3

是的，DOM节点不是数组，所以如果你想这样做，你需要定义自己的函数来实现。例如，您可以定义切片函数：

function slice(list, start, end) {
    var result = []
    for (var i = start; i < end; i++) {
        result.push(list[i])
    }
    return result
}

例如，

slice(document.getElementById("container").children, 0, 5)

在我看来，这样的＆＃34;帮手＆＃34;应该很少单独创建方法，除非您绝对确定您将足够切片DOM节点列表以节省技术负载。对我来说，这些＆＃34;帮手＆＃34;函数带来了认知负载，这些认知负载在Ramda.js等更大的框架中才真正有意义。我的意思是，只要在框架内你使用或开发。

您可以尝试查看其中一个功能框架，看看它是否对您有意义。例如，Ramda.js已经有一个切片方法，可以切片DOM节点或任何其他类似数组的对象：

R.slice(0, 5, document.getElementById("container").children)

Answer 4

slice是Array方法，但可以在Array-like objects上使用：

＆＃13;

console.log( [].slice.call(container.children, 2) )

console.log( [].slice.bind(container.children)(2) )

console.log( [].slice.apply(container.children, [2]) )

＆＃13;

<div id="container">
  <p> 1 </p>
  <p> 2 </p>
  <p> 3 </p>
  <p> 4 </p>
 </div>

＆＃13;

如何切片儿童阵列？

4 个答案: