Tengo un div con varios hijos que tienen una gran estructura div en ellos. Ahora quiero encontrar un elemento con un texto interno específico. ¿Cómo puedo hacer esto? Escuché algo de document.evaluate, pero ¿es esto lo correcto?
<div className="main"> <div className="child1"> <div> <div><label className="text1">First Label</label></div> </div> </div> <div className="child2"> <div> <div><label className="text2">Second Label</label></div> </div> </div> <div className="child3"> <div> <div><label className="text3">Third Label</label></div> </div> </div> </div>Tengo principal y quiero encontrar la etiqueta con el texto Segunda etiqueta sin múltiples bucles.
Usando una expresión XPath en Javascript, puede consultar el elemento específico y usar text() para consultar el texto dentro del elemento.
const getnodes = function(expr, parent) { let results = []; let contextNode = parent || document; let query = document.evaluate(expr, contextNode, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (let i = 0, length = query.snapshotLength; i < length; ++i) { results.push(query.snapshotItem(i)); } return results; }; let col = getnodes('//div[@class="main"]//label/text()[ contains(.,"Second Label") ]'); col.forEach(n => { console.log(n.textContent) }); let ref=document.querySelector('div.main > div.child3'); col=getnodes('div/div/label',ref); col.forEach(n => { console.log('Using explicit reference node:',n.textContent) }); <div class="main"> <div class="child1"> <div> <div><label class="text1">First Label</label></div> </div> </div> <div class="child2"> <div> <div><label class="text2">Second Label</label></div> </div> </div> <div class="child3"> <div> <div><label class="text3">Third Label</label></div> </div> </div> </div>Hola, puedes usar la búsqueda de ruta. Para obtener más información sobre este documento de verificación evaluar
var xPath = "//label[contains(text(),'First Label')]"; console.log(document.evaluate(xPath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue);Puede hacerlo a través de document.querySelectorAll ("label")
const len = document.querySelectorAll("label"); for (let i = 1; i < len.length+1; i++) { var el = document.querySelector("label[classname=text"+i+"]"); console.log(el.innerText); if(el.innerText == "First Label") { console.log("Found!"); } }