Obtuve el elemento DOM que tiene muchas etiquetas Div dentro, sin ninguna clase o ID. Todo lo que quiero es obtener valores del atributo div "datos como pseudo-elemento" usando Javascript (sin JQuery ni ninguna otra biblioteca).
El resultado debería ser:
Hello How Are You ABC XYZ <div role="none" > <div data-as-pseudo-element="Hello How Are You" style="position: relative;display: inline;" ></div> <div data-as-pseudo-element="ABC" style="position: relative;display: inline;" ></div> <div data-as-pseudo-element="XYZ" style="position: relative;display: inline;" ></div> </div>¡Gracias por adelantado!
Fácil de hacer usando querySelectorAll para encontrar los elementos y el conjunto de dataset para extraer el valor:
for (div of document.querySelectorAll('div[data-as-pseudo-element]')) { console.log(div.dataset.asPseudoElement) } <div role="none" > <div data-as-pseudo-element="Hello How Are You" style="position: relative;display: inline;" ></div> <div data-as-pseudo-element="ABC" style="position: relative;display: inline;" ></div> <div data-as-pseudo-element="XYZ" style="position: relative;display: inline;" ></div> </div>Gracias Tomás por la solución. No sé por qué, su código funciona bien en mi página de prueba, pero devuelve indefinido en la página real (versión web de llamadas de Skype).
Descubrí otra forma de hacerlo:
var tranScript = ""; var divs = document.querySelectorAll('div[data-as-pseudo-element]'), i; for (i = 0; i < divs.length; ++i) { tranScript += divs[i].attributes["data-as-pseudo-element"].textContent.toString() +"\n" ; } console.log(tranScript); <div role="none" > <div data-as-pseudo-element="Hello How Are You" style="position: relative;display: inline;" ></div> <div data-as-pseudo-element="ABC" style="position: relative;display: inline;" ></div> <div data-as-pseudo-element="XYZ" style="position: relative;display: inline;" ></div> </div>