javascript - html data attribute jquery
¿Por qué el código JS "var a=document.querySelector(''a[data-a=1]'');" causa un error? (4)
Tengo un elemento en el DOM:
<a href="#" data-a="1">Link</a>
Quiero obtener este elemento a través de su datos de atributo de data-a personalizados HTML5 data-a . Así que escribo códigos JS:
var a = document.querySelector(''a[data-a=1]'');
Pero este código no funciona y me sale un error en la consola del navegador. (Probé Chrome y Firefox).
Código JS var a = document.querySelector(''a[data-a=a]''); no causa error Así que creo que el problema es que el JS API document.querySelector HTML5 no admite el valor numérico en el atributo de datos personalizados HTML5.
¿Es este un problema de error de implementación del navegador o un problema de especificación de HTML5 relevante para document.querySelector ?
Luego probé los códigos a continuación en http://validator.w3.org/ :
<!DOCTYPE html>
<meta charset="utf-8">
<title>An HTML Document</title>
<a href="#" data-a="1">Link</a>
Ellos están validados. Dado que estos códigos HTML5 están validados. Deberíamos utilizar el document.querySelector JS API document.querySelector HTML5 para buscar este elemento de anclaje a través de su atributo de datos personalizado. Pero el hecho es que me da error.
¿Las especificaciones de HTML5 a HTML5 JS API document.querySelector dicen que este método no puede buscar un atributo personalizado de datos HTML5 con un valor numérico? (Se necesita una fuente de especificación HTML5.)
De la especificación de selectores :
Los valores de atributo deben ser identificadores de CSS o cadenas.
Los identificadores no pueden comenzar con un número. Las cadenas deben ser citadas.
1 por lo tanto, no es un identificador válido ni una cadena.
Use "1" (que es una cadena) en su lugar.
var a = document.querySelector(''a[data-a="1"]'');
Me tomó un tiempo encontrarlo, pero si tiene un número almacenado en una variable, digamos x y desea seleccionarlo, use
document.querySelector(''a[data-a= + CSS.escape(x) + '']'').
Esto se debe a algunas especificaciones de nombres de atributo con las que aún no estoy muy familiarizado. Espero que esto ayude a alguien.
Podrías usar
var a = document.querySelector(''a[data-a="1"]'');
en lugar de
var a = document.querySelector(''a[data-a=1]'');
Sí, las cadenas se deben citar y, en algunos casos, como en AppleScript, se deben escapar las comillas
do JavaScript "document.querySelector(''span[" & attrName & "=/"" & attrValue & "/"]'').click();"