querySelectorAllの使用後に要素を配列にプッシュできません。

Question

したがって、いくつかのプロパティを持つ単純なクラスがあります。プロトタイピングを使用して私はいくつかのメソッドを追加します。これらのメソッドはthisを返します。

Getメソッドはすべての要素を見つけ、allCurrentElementsに配置します（少なくとも私はそうだと思います）。 CreateElementメソッドを使用すると、要素を作成して既存の配列allCurrentElementsにプッシュしようとします。

これを使用するには、単にvar a = _h.Get('p').CreateElement('div')と書いてください。そしてここに私がエラーUncaught TypeError: this.allCurrentElements.push is not a function(…)を得るところです。

インデックスを使用して新しく作成した要素を割り当てようとすると、エラーはスローされませんが、この要素は配列には表示されません。

var _h = (function(){ 
    var Helper = function(){ 
     this.allCurrentElements = []; 
    } 

    Helper.prototype.Get = function(query){ 
     this.allCurrentElements = document.querySelectorAll(query); 
     return this; 
    } 

    Helper.prototype.CreateElement = function(el, attr) { 
     var elem = document.createElement(el); 
     for (var a in attr) { 
      elem[a] = attr[a]; 
     } 

     //this.allCurrentElements[this.allCurrentElements.length] = elem; 
     this.allCurrentElements.push(elem); 
     return this; 
    } 

    return new Helper(); 
})(); 

https://jsfiddle.net/Ldp58onu/

Answer 1

あなたは、すべての一致する要素ノードの非ライブのNodeListを返します

Document.querySelectorAll()ドキュメントhttps://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll

を確認する必要があります。

NodeListは、配列と非常によく似ていて、Array.prototypeメソッドを呼び出すのが魅力的ですが、NodeListオブジェクトには使い慣れたArrayメソッドはありません。配列のようなオブジェクトである

Array.prototype.forEach.call(document.querySelectorAll(query), function(element){ 

     allCurrentElements.push(element); 

}); 

Answer 2

document.querySelectorAll()戻りNodeList：

だからあなたのような何かのNodeListを反復処理する必要があります。

問題は、ノードリストが読み取り専用であることです。それを配列で変換する必要があります。 Array.prototype.slice.call(document.querySelectorAll(query));

その後、あなたは何でもできます。