creare un HTMLCollection

Question

sto cercando di spessorare Element.prototype.children che dovrebbe restituire un HTMLCollection

C'è un window.HTMLCollection

Tuttavia

var h = new HTMLCollection(); 
//TypeErrror: HTMLCollection is not a constructor 

e

var h = Object.create(HTMLCollection.prototype); 
h[0] = div; 
h.item(0); 
// Could not convert JavaScript argument 

test Firefox 7 e Chrome

Oltre allo shimming HTMLCollection c'è un modo per interagire con esso?

anche fornire feedback su this github issue se si può suggerire una soluzione

Answer 1

Ecco come lo farei:

function MyHTMLCollection(arr) { 
    for (var i = 0; i < arr.length; i += 1) { 
     this[i] = arr[i]; 
    } 

    // length is readonly 
    Object.defineProperty(this, 'length', { 
     get: function() { 
      return arr.length; 
     } 
    }); 

    // a HTMLCollection is immutable 
    Object.freeze(this); 
} 

MyHTMLCollection.prototype = { 
    item: function (i) { 
     return this[i] != null ? this[i] : null; 
    }, 
    namedItem: function (name) { 
     for (var i = 0; i < this.length; i += 1) { 
      if (this[i].id === name || this[i].name === name) { 
       return this[i]; 
      } 
     } 
     return null; 
    } 
}; 

dove arr è una serie regolare che contiene tutti gli elementi DOM che dovrebbero essere all'interno del HTMLCollection.

per fare la lista:

• l'argomento arr dovrebbe essere controllato in anticipo: è un array? Tutti gli elementi degli elementi DOM dell'array sono tutti?

Answer 2

Non aspettatevi oggetti host a comportarsi come (ECMAScript) oggetti nativi, sono cose completamente diverse. Alcuni browser implementano i loro oggetti DOM come gli oggetti ECMAScript, ma non è richiesto e non dovrebbe essere invocato. Nota che la maggior parte delle raccolte HTML sono attive, è molto difficile emularle in un oggetto nativo.

Answer 3

So che questa è una domanda più vecchio, ma mi sono imbattuto in una simile esigenza di creare un HTMLCollection vuoto e l'ho fatto semplicemente creando un elemento e poi correre getElementsByClassName() contro di esso con una classe che non esiste nell'elemento

document.createElement("div").getElementsByClassName('noClassHere'); 

Restituisce un oggetto HTMLCollection vuoto.