Cuando un navegador navega a una URL como http://example.com/#foo , se desplaza al elemento identificado por #foo ; este elemento del URI se denomina identificador de fragmento. Supongamos que tengo un identificador de fragmento para un elemento en la página actual, a la que aún no he navegado. ¿Cómo puedo saber a qué nodo DOM habría apuntado?
document.getElementById , porque un identificador de fragmento #foo también puede apuntar a un ancla de estilo antiguo, <a name="foo"> , que este método no detecta.document.getElementsByName , porque eso encontraría elementos que no son anclas como nodos <input> o <textarea> , y perdería elementos identificados por el atributo id= .document.querySelector(':target') . ¿Existe una forma confiable de encontrar qué nodo DOM habría sido el objetivo del identificador de fragmento que detecta todos los casos? Si la solución usa querySelector , por supuesto me gustaría que fuera resistente frente a los caracteres inusuales que se encuentran dentro de los identificadores, por obsoletos que sean.
Un selector es la forma más fácil de decir "Un elemento con una ID o a elemento con un nombre".
CSS.escape manejará los caracteres especiales por usted.
const fragment_id = `fdfd""fewf"`; // The test string I used for this const escaped_fragment_id = CSS.escape(fragment_id); const element = document.querySelector(`#${escaped_fragment_id}, a[name="${escaped_fragment_id}"`) Tenga en cuenta que es posible que también necesite usar decodeURIComponent si se ha escapado la fuente de fragment_id .