スプライス機能をNodeList配列に適用する方法は？

Question

NodeList要素の順序を変更したい、たとえばnode2の後にnode1を移動する。

var cols = document.querySelectorAll("ul>li"); 
var target = cols[0]; 
[].splice.call(cols,[0, 1]); 
[].splice.call(cols,[3, 0, target]); 

しかし、それは例外をスロー：コードは次のとおりである

Uncaught TypeError: Cannot set property length of # which has only a getter

それはNodeListを配列にスプライス機能を適用することはできませんということですか？

Answer 1

Does it mean cannot apply splice function to NodeList array?

はい、それはのNodeList isn't an array, but an array-like objectので、ありません。 Array.prototype.function.apply(someNodeList)は、NodeListを変更しない場合に機能します。ないことのNodeListて - あなたの目標は、要素再オーダーする場合

---

、あなたはDOMにいくつかの他の方法を操作する必要がありますことを考慮する必要があります。

関連

// Clearly Unikong is superior so we have to fix that it is not at the top. 
 

 
var list = Array.prototype.slice.call(document.querySelectorAll('ul>li')).reduce(function(init, el) { 
 
    if (el.innerText === 'Unikong') { 
 
    init.splice(0, 0, el); 
 
    } else 
 
    init.push(el); 
 
    return init; 
 
}, []).reduce(function(init, el) { 
 
    init.appendChild(el); 
 
    return init; 
 
}, document.createElement('ul')), 
 
    oldList = document.querySelector('ul'); 
 

 
document.querySelector('ul').parentNode.replaceChild(list, oldList);

<ul> 
 
    <li>One Bunny</li> 
 
    <li>Two Bunny</li> 
 
    <li>Three Bunny</li> 
 
    <li>Unikong</li> 
 
</ul>

Answer 2

、アレイへのNodeListを読んで試してみてください。

var cols_array = [].slice.call(cols); 
cols_array.splice(0, 1); 

あなたが実際のNodeListを変更することはできません、それだけでquerySelectorAllが見つかったノードのリストを表します。