HTMLFormControlsCollection: phương thức namedItem()
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Phương thức HTMLFormControlsCollection.namedItem() trả về RadioNodeList hoặc Element trong bộ sưu tập có name hoặc id khớp với tên được chỉ định, hoặc null nếu không có nút nào khớp.
Lưu ý rằng phiên bản namedItem() này ẩn phiên bản kế thừa từ HTMLCollection. Giống như phiên bản đó, trong JavaScript, sử dụng cú pháp dấu ngoặc mảng với String, ví dụ collection["value"] tương đương với collection.namedItem("value").
Cú pháp
namedItem(name)
[name]
Tham số
name-
Chuỗi sẽ được sử dụng để khớp với các thuộc tính
namehoặcidcủa các điều khiển trong đối tượngHTMLFormControlsCollectionnày.
Giá trị trả về
RadioNodeListnếu có nhiều phần tử vớinamehoặcidđã cho,Elementnếu có đúng một phần tử vớinamehoặcidđã cho, hoặcnullnếu không có phần tử nào cónamehoặcidđã cho.
Note:
RadioNodeList trả về là live, nghĩa là nội dung của nó tự động cập nhật nếu các phần tử khớp với tên được cho được thêm vào hoặc xóa khỏi bộ sưu tập. Hơn nữa, nó có thể chứa các phần tử input không phải radio mặc dù tên của bộ sưu tập.
Ví dụ
Sử dụng namedItem()
HTML
<form>
<label for="yes">Yes</label>
<input id="yes" name="my-radio" type="radio" />
<label for="no">No</label>
<input id="no" name="my-radio" type="radio" />
<label for="maybe">Maybe</label>
<input id="maybe" name="my-radio" type="radio" />
<br />
<label for="text1">Text input 1</label>
<input id="text1" name="my-form-control" type="text" />
</form>
<div id="output"></div>
JavaScript
const form = document.querySelector("form");
const items = form.elements.namedItem("my-radio");
const output = document.querySelector("#output");
const itemIDs = Array.from(items)
.map((item) => `"${item.id}"`)
.join(", ");
const item2 = form.elements.namedItem("my-form-control");
output.textContent = `My items: ${itemIDs}
My single item: "${item2.id}"`;
Kết quả
Thông số kỹ thuật
| Specification |
|---|
| HTML # dom-htmlformcontrolscollection-nameditem-dev |
Tương thích trình duyệt
Xem thêm
HTMLCollection.namedItemmà nó thay thế