attribute - queryselector javascript ejemplos

Usar querySelector con ID que son números

Question

Por lo que entiendo, las especificaciones HTML5 le permiten usar ID que son números como este.

<div id="1"></div>
<div id="2"></div>

Puedo acceder a estos bien usando getElementById pero no con querySelector . Si intento hacer lo siguiente, obtengo SyntaxError: DOM Exception 12 en la consola.

document.querySelector("#1")

Solo tengo curiosidad por saber por qué usar números como ID no funciona con querySelector cuando la especificación de HTML5 dice que estos son válidos. Intenté varios navegadores.

Answer 1

Es válido, pero requiere un manejo especial. Desde aquí: http://mathiasbynens.be/notes/css-escapes

Dígitos principales

Si el primer carácter de un identificador es numérico, tendrá que escapar en función de su punto de código Unicode. Por ejemplo, el punto de código para el personaje 1 es U + 0031, por lo que se escaparía como / 000031 o / 31.

Básicamente, para escapar de cualquier carácter numérico, simplemente póngalo con / 3 y añada un carácter de espacio (). ¡Yay Unicode!

Entonces su código terminaría como (CSS primero, segundo JS):

#/31  {
    background: hotpink;
}

document.getElementById(''1'');
document.querySelector(''#//31 '');

Answer 2

Porque si bien son válidos en las especificaciones de HTML5, no son válidos en CSS, que es lo que significa " selector de consultas".

En cambio, tendrías que hacer esto: document.querySelector("[id=''1'']") , que es muy largo considerando que podrías darle una identificación significativa como message1 o algo así;)