Cách sử dụng querySelectorTất cả chỉ cho các phần tử có tập hợp thuộc tính cụ thể?

Question

Tôi đang cố gắng sử dụng document.querySelectorAll cho tất cả các hộp kiểm có tập hợp thuộc tính value.

Có các hộp kiểm khác trên trang không có value được đặt và giá trị khác nhau cho mỗi hộp kiểm. Các id và tên không phải là duy nhất mặc dù.

Ví dụ: <input type="checkbox" id="c2" name="c2" value="DE039230952"/>

Làm thế nào để chọn chỉ những hộp kiểm đã giá trị thiết lập?

Answer 1

Bạn có thể sử dụng querySelectorAll() như thế này:

var test = document.querySelectorAll('input[value][type="checkbox"]:not([value=""])'); 

Điều này được chuyển tới:

nhận được tất cả nguyên liệu đầu vào với "giá trị" thuộc tính và có thuộc tính "giá trị" đó không phải là trống.

In this demo, nó sẽ vô hiệu hóa hộp kiểm có giá trị không trống.

Answer 2

Mẹo tắm:

Nhiều "nots", nhập vào đó là KHÔNG ẩn và không bị vô hiệu hóa:

:not([type="hidden"]):not([disabled]) 

Ngoài ra bạn có biết bạn có thể làm điều này:

node.parentNode.querySelectorAll('div'); 

Điều này tương đương với jQuery:

$(node).parent().find('div'); 

Việc này sẽ tìm tất cả các div trong "nút" và dưới đây đệ quy, HOT DANM!

Answer 3

document.querySelectorAll() cho đầu vào chỉ trả về đầu vào kiểm tra theo mặc định.

Kính trọng;)