Mateo, parte de este equipo, nos ha hecho el favor de crear este artículo porque controla a la perfección este tema.
Solución:
Solución comodín basada en la identificación del elemento attribute
Sí, es posible. Esto responde a su pregunta directamente sin depender de JavaScript o API de terceros o attributes que no sea el id del elemento. Además, no tienes que usar class=
Ejemplo de llamada de método personalizado
// Uses JavaScript regex features to search on id= attribute
var arrMatches = document.getElementsByRegex('^statusMessage_.*');
Esto obtiene un array que contiene todos los elementos que tienen una identificación que comienza con “statusMessage_” (incluso los anidados).
Ejemplo de implementación: reutilizable y genérico
Aquí hay una implementación para el getElementsByRegex función que busca en el DOM la expresión regular dada, a partir de document. Se adjunta al objeto del documento por conveniencia y de acuerdo con el comportamiento esperado.
Es probable que haya implementaciones más eficientes, pero esta proporciona un comienzo. El cuerpo de la función se puede reemplazar con otros algoritmos según el gusto.
Probar el código
Finalmente, pruébelo usando una publicidad HTML que tenga elementos anidados como este
1
2
other stuff
3
Este bloque HTML contiene tres elementos que comienzan con id="statusMessage_; por lo tanto, la prueba de alerta dirá
“encontré 3 coincidencias – esperaba 3”
Anexo de información para variaciones
Si desea restringir la búsqueda solo a elementos div o algún otro tipo de elemento específico, deberá inyectar lo siguiente getElementByTagName código en el algoritmo para restringir el conjunto de elementos buscados.
var arrDivs = document.getElementsByTagName("div"); // pull all divs from the doc
Es posible que desee modificar el algoritmo genérico pasando el nombre de la etiqueta en un segundo argumento para filtrar antes de que comience la búsqueda de esta manera
var arrMatches = document.getElementsByRegex('^statusMessage_.*', 'div');
Solo pensé que valía la pena actualizar el hilo con una forma más reciente de hacer esto en JavaScript, ya que todavía aparecía en las búsquedas.
document.querySelector("[id^='statusMessage_']");
caniuse.com enumera que se puede usar en ID de IE8 y es un excelente soporte en otros navegadores.
Usando jQuery puedes hacer esto
$("div[id^='statusMessage_']")
Ver atributoEmpiezaCon
Editar – con selector de nombre de clase
Si puede usar un nombre de clase, entonces puede usar algo como esto
$$('div.myDivClass');
obtiene todos los elementos div con la clase ‘myDivClass’
Acuérdate de que tienes autorización de valorar este artículo si diste con la respuesta.