Liệu querySelectorTất cả ký tự hỗ trợ (.) Trong id?

Question

Liệu querySelectorTất cả ký tự hỗ trợ (.) Trong id?

Ý tôi là nếu tôi thêm một yếu tố như dưới đây:

var div = document.createElement('div'); 
div.id='my.divid'; 
document.body.appendChild(div); 

và sau đó tôi sử dụng querySelectorAll như dưới đây:

document.querySelectorAll('#my.divid'); 

tôi đã không có gì!

Vì vậy, dấu chấm là ký tự pháp lý cho id và querySelectorAll là phương thức chính thức mà firefox cung cấp, tôi không thể tin rằng phương thức không hỗ trợ dấu chấm (.) Trong id. Tôi đã phạm sai lầm sao?

Cảm ơn!

Answer 1

Khoảng thời gian trong querySelectorAll có nghĩa là bạn đang chỉ định một lớp css. Trong trường hợp của bạn, querySelectorAll đang cố gắng tìm một phần tử DOM có id "của tôi" và có một lớp "phân chia" css. Làm thế nào sẽ querySelectorAll biết rằng lần này bạn muốn phần tử theo id chứ không phải theo lớp? Việc bạn có quyền sở hữu id thích hợp để không làm nhầm lẫn phương pháp. Mặc dù một khoảng thời gian được cho phép, cách tốt nhất là tránh hầu hết thời gian để bạn không nhầm lẫn các thư viện khác như jquery, v.v.

Answer 2

Bạn cần phải nhớ rằng . đại diện cho một selector lớp, vì vậy chọn #my.divid đại diện cho một phần tử với ID my và một lớp divid, không một yếu tố với ID my.divid. Vì vậy, các yếu tố sau đây sẽ được kết hợp bởi bộ chọn của bạn:

var div = document.createElement('div'); 
div.id = 'my'; 
div.className = 'divid'; 
document.body.appendChild(div); 

Nếu bạn cần chọn một phần tử với ID my.divid như bạn đã đưa ra ở trên, bạn cần phải thoát khỏi giai đoạn:

document.querySelectorAll('#my\\.divid'); 

Lưu ý rằng dấu gạch chéo ngược kép là bởi vì nó là một chuỗi chọn JS; trong quy tắc CSS, bạn sẽ sử dụng một dấu gạch chéo ngược duy nhất: #my\.divid

Answer 3

Tôi chắc chắn rằng điều đó thậm chí không hợp pháp trong id. và trong CSS, điều đó sẽ được hiểu như sau: <div id="my" class="divid"></div>. Bạn không bao giờ có thể tạo kiểu theo cách đó. Và kể từ querySelectorAll sử dụng cùng một trình phân tích cú pháp (tôi nghĩ), bạn sẽ có những rắc rối tương tự.