DocumentFragment: phương thức querySelector()
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 DocumentFragment.querySelector() trả về phần tử đầu tiên, hoặc null nếu không tìm thấy kết quả khớp, trong DocumentFragment (sử dụng duyệt đệ quy các nút của tài liệu theo thứ tự trước) khớp với nhóm bộ chọn đã chỉ định.
Nếu bộ chọn khớp với một ID và ID này được sử dụng sai nhiều lần trong tài liệu, nó trả về phần tử khớp đầu tiên.
Nếu các bộ chọn được chỉ định trong tham số không hợp lệ, một DOMException với giá trị SYNTAX_ERR sẽ được ném ra.
Cú pháp
querySelector(selectors)
Tham số
selectors-
Một chuỗi chứa một hoặc nhiều bộ chọn CSS được phân tách bằng dấu phẩy.
Giá trị trả về
Một đối tượng Element đại diện cho phần tử đầu tiên trong tài liệu khớp với tập hợp bộ chọn CSS đã chỉ định, hoặc null được trả về nếu không có kết quả khớp.
Ví dụ
>Ví dụ cơ bản
Trong ví dụ cơ bản này, phần tử đầu tiên trong DocumentFragment có lớp myclass được trả về:
const el = documentfragment.querySelector(".myclass");
Cú pháp CSS và đối số của phương thức
Chuỗi đối số truyền cho querySelector phải tuân theo cú pháp CSS. Để khớp với ID hoặc các bộ chọn không tuân theo cú pháp CSS (ví dụ: sử dụng dấu chấm phẩy hoặc dấu cách không đúng cách), bắt buộc phải thoát ký tự sai bằng hai dấu gạch chéo ngược:
<div id="foo\bar"></div>
<div id="foo:bar"></div>
document.querySelector("#foo\bar"); // Không khớp với gì cả
document.querySelector("#foo\\\\bar"); // Khớp với div đầu tiên
document.querySelector("#foo:bar"); // Không khớp với gì cả
document.querySelector("#foo\\:bar"); // Khớp với div thứ hai
Đặc điểm kỹ thuật
| Specification |
|---|
| DOM> # ref-for-dom-parentnode-queryselector①> |
Tương thích trình duyệt
Xem thêm
- Giao diện
DocumentFragmentmà nó thuộc về.