tạo HTMLCollection

Question

Tôi đang cố gắng để Shim Element.prototype.children mà phải trả lại một HTMLCollection

Có một window.HTMLCollection

Tuy nhiên

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

và

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

thử nghiệm Firefox 7 và Chrome

Ngoài việc cắt tỉa HTMLCollection có cách nào để tương tác với nó không?

Cũng cung cấp thông tin phản hồi trên this github issue nếu bạn có thể đề nghị một giải pháp

Answer 1

Đây là cách tôi sẽ làm điều đó:

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; 
    } 
}; 

nơi arr là một mảng thông thường có chứa tất cả các phần tử DOM mà nên bên trong HTMLCollection.

Để làm danh sách:

• lập luận arr nên được kiểm tra trước: Có một mảng? Có phải tất cả các phần tử của các phần tử DOM mảng đó không?

Answer 2

Đừng nghĩ rằng đối tượng máy chủ để hành xử tương tự (ECMAScript) vật bản địa, họ là những thứ hoàn toàn khác nhau. Một số trình duyệt thực hiện các đối tượng DOM của chúng như đối tượng ECMAScript, nhưng nó không bắt buộc và không nên dựa vào. Lưu ý rằng hầu hết các bộ sưu tập HTML đều hoạt động, rất khó để mô phỏng nó trong một đối tượng gốc.

Answer 3

Tôi biết đây là một câu hỏi cũ nhưng tôi tình cờ gặp một nhu cầu tương tự để tạo ra một HTMLCollection trống rỗng và tôi đã làm nó bằng cách đơn giản tạo ra một phần tử và sau đó chạy getElementsByClassName() chống lại nó bằng một lớp không tồn tại trong phần tử.

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

Trả về đối tượng HTMLCollection trống.