Cómo usar querySelectorAll solo para elementos que tienen un conjunto de atributos específico?

Question

Estoy tratando de usar document.querySelectorAll para todas las casillas de verificación que tienen el conjunto de atributos value.

Hay otras casillas de verificación en la página que no tienen value conjunto, y el valor es diferente para cada casilla de verificación. Los identificadores y nombres no son únicos.

Ejemplo: <input type="checkbox" id="c2" name="c2" value="DE039230952"/>

¿Cómo seleccionar sólo aquellas casillas de verificación que se han establecido valores?

Answer 1

Puede utilizar querySelectorAll() así:

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

Esto se traduce en:

obtener todas las entradas con el atributo "value" y tiene el "valor" atributo que no está en blanco.

In this demo, desactiva la casilla de verificación con un valor no en blanco.

Answer 2

Consejos adicionales:

Múltiples "no tienen", de entrada que no está oculta y no bloqueado:

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

También sabía usted puede hacer esto:

node.parentNode.querySelectorAll('div'); 

Esto es equivalente a jQuery's:

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

Lo que efectivamente encontrará todos los divs en "nodo" y debajo recursivamente, ¡HOT DANM!

Answer 3

document.querySelectorAll() para la entrada solo devuelve entradas checkd por defecto.

Saludos;)