querySelectorAll返回结果使用slice取前6个元素失效如何解决

querySelectorAll() 接口返回的是 NodeList 类数组对象，并非 JavaScript 原生数组，本身没有挂载 Array 原型上的 slice 方法，直接调用会报错不生效。
同时你当前代码中写的是 slice(0,5)，由于slice是左闭右开的规则，实际只会取下标为0~4的5个元素，如果要取前6个，第二个参数需要设置为6。

你可以任选以下任意一种方法将 NodeList 转为真实数组后再调用slice即可：

• 方案1：使用扩展运算符转换

  [...books].slice(0,6).forEach(bookXmlNode => {
    // 原有遍历逻辑不变
  })
  

• 方案2：使用Array.from方法转换

  Array.from(books).slice(0,6).forEach(bookXmlNode => {
    // 原有遍历逻辑不变
  })
  

• 方案3：借用数组原型的slice方法直接调用

  Array.prototype.slice.call(books,0,6).forEach(bookXmlNode => {
    // 原有遍历逻辑不变
  })
  

let xmlContent = '';
let tableBooks = document.getElementById('books');
fetch('info2.xml').then((response)=> {
    response.text().then((xml)=>{
        xmlContent = xml;
        let parser = new DOMParser();
        let xmlDOM = parser.parseFromString(xmlContent, 'application/xml');
        
        let container = xmlDOM.querySelector("[ID='91961']");
        let books = container.querySelectorAll("SAISON");
        
        // 转数组后取前6个元素
        [...books].slice(0,6).forEach(bookXmlNode => {
            let row = document.createElement('tr');
            //Saison
            let td = document.createElement('td');
            td.innerText = bookXmlNode.children[0].innerHTML;
            row.appendChild(td);
            //  von-bis
            td = document.createElement('td');
            td.innerText = bookXmlNode.children[1].innerHTML +" - " + bookXmlNode.children[2].innerHTML;
            row.appendChild(td);
            //preis
            td = document.createElement('td');
            td.innerText = bookXmlNode.children[3].children[2].innerHTML +" €";
            row.appendChild(td);
            tableBooks.children[0].appendChild(row);
        });
    });
});  

内容的提问来源于stack exchange，提问作者bruno2000