Hướng dẫn htmlcollection item returns null - mục htmlcollection trả về null

Trong một ứng dụng Angular, tôi đang sử dụng JS đơn giản để lấy các phần tử bằng mã tên lớp:

var testElements = document.getElementsByClassName("project-link");
console.log(testElements);

Bản in này như vậy:

[item: function, namedItem: function]
0: a.project-link.ng-binding
1: a.project-link.ng-binding
...
30: a.project-link.ng-binding
length: 32
__proto__: HTMLCollection

Tuy nhiên. Nếu tôi thử in một mục một mình, điều này sẽ trả về NULL:

console.log(testElements.item(4));
null

Tôi không hiểu điều gì sai với mã này, tôi cũng đã thử mảng.prototype.filter.call Chức năng và nó cũng không hoạt động. Bất kỳ ý tưởng?

hỏi ngày 18 tháng 2 năm 2015 lúc 12:38Feb 18, 2015 at 12:38

Hướng dẫn htmlcollection item returns null - mục htmlcollection trả về null

4

Tôi đã sửa lỗi này bằng cách thêm mã của tôi bên trong chức năng tải cửa sổ:

window.addEventListener("load", function(event) {
   // your code ....
 });

Hướng dẫn htmlcollection item returns null - mục htmlcollection trả về null

Lỗi

4.4729 Huy hiệu vàng32 Huy hiệu bạc41 Huy hiệu đồng9 gold badges32 silver badges41 bronze badges

Đã trả lời ngày 28 tháng 6 năm 2018 lúc 12:11Jun 28, 2018 at 12:11

Hướng dẫn htmlcollection item returns null - mục htmlcollection trả về null

Edhar Dowbakedhar DowbakEdhar Dowbak

2.4781 Huy hiệu vàng9 Huy hiệu bạc12 Huy hiệu đồng1 gold badge9 silver badges12 bronze badges

Điều này là do mã JS được tải trước khi cây DOM trong HTML được xây dựng. Tại thời điểm này, trang vẫn còn trống, vì vậy NULL được trả lại.

Sử dụng Window.onload


Đã trả lời ngày 12 tháng 7 lúc 7:43Jul 12 at 7:43

setTimeout(() => {
  console.log(testElements.item(4));
}, 0);

Hãy thử điều này, nó có thể giúp ~ Tôi không biết tại sao, nhưng nó hoạt động cho tôi.
I don't know why, but it works for me.

Đã trả lời ngày 5 tháng 5 năm 2019 lúc 7:50May 5, 2019 at 7:50

Hướng dẫn htmlcollection item returns null - mục htmlcollection trả về null

Yuanyuanyuan

1.4322 huy hiệu vàng9 Huy hiệu bạc23 Huy hiệu đồng2 gold badges9 silver badges23 bronze badges

1

Loại hình

Yếu tố

Phần tử tại chỉ mục được chỉ định. null Nếu chỉ số nằm ngoài phạm vi.
let text = collection.innerHTML;

Hãy tự mình thử »

Nhiều ví dụ hơn

Thí dụ
let text = collection.innerHTML;

Hãy tự mình thử »

Thay đổi nội dung HTML của phần tử đầu tiên:

document.getElsementByTagName ("p") [0] .innerhtml = "Đoạn đã thay đổi";

Hãy tự mình thử »

Thêm ví dụ dưới đây.


Định nghĩa và cách sử dụng

Phương thức item() trả về phần tử tại một chỉ mục được chỉ định trong một htmlCollection.


HTMLCollection

HTMLCollection là một bộ sưu tập giống như mảng (danh sách) các phần tử HTML.

Các yếu tố trong bộ sưu tập có thể được truy cập bằng chỉ mục (bắt đầu từ 0).

Thuộc tính độ dài trả về số lượng các phần tử trong bộ sưu tập.



Cú pháp

HtmlCollection.Item (index)

hoặc

Thông số

Tham sốSự mô tả
mục lụcYêu cầu. Chỉ số của phần tử để trả lại. Chỉ số bắt đầu ở 0.
The index of the element to return.
The index starts at 0.

Giá trị trả lại

Loại hìnhSự mô tả
mục lụcYêu cầu. Chỉ số của phần tử để trả lại. Chỉ số bắt đầu ở 0.
null if the index is out of range.


Giá trị trả lại

Loại hình

Yếu tố

Phần tử tại chỉ mục được chỉ định. null Nếu chỉ số nằm ngoài phạm vi.

Nhiều ví dụ hơn
  collection.item(i).style.fontSize ="24px";
}

Hãy tự mình thử »

Thí dụ

Vòng lặp trên tất cả các phần tử với class = "myClass" và thay đổi kích thước phông chữ của chúng:

const thu thập = document.getelementsbyClassName ("myClass");
const collection = div.getElementsByTagName("p");
let text = collection[1].innerHTML;

Hãy tự mình thử »


for (let i = 0; i

Thí dụ

Nhận nội dung của phần tử thứ hai bên trong "MyDiv": const div = document.getEuityById ("myDiv"); const thu thập = div.getElsByTagName ("p"); Đặt văn bản = thu thập [1] .innerhtml;Hỗ trợ trình duyệtHTMLCollection.item() được hỗ trợ trong tất cả các trình duyệt:Trình duyệt ChromeI E
Bờ rìaBờ rìaBờ rìaBờ rìaBờ rìaBờ rìa