Obtengo un HTML que necesito analizar para poder leer el texto bajo un título determinado. Más específicamente, hay una etiqueta div que incluye varios elementos H2 y solo necesito leer el texto entre el tercer y cuarto encabezado H2, es decir, la sección Resumen.
<div> <h2>Risks</h2> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p> <p>Donec fermentum orci nec felis.</p> <h2>Affected Systems</h2> <p>Sed sollicitudin diam id sapien.</p> <p>Ut libero.</p> <h2>Summary</h2> <!-- from here --> <p>Vestibulum quam libero, malesuada et, ornare id, aliquet id, tellus.</p> <p>Nullam dapibus viverra quam.</p> <p>Vestibulum sit amet nunc vel justo dictum pharetra.</p> <!-- through here --> <h2>Avoidance</h2> <p>Proin eleifend mi eget massa.</p> <p>Pellentesque feugiat sapien a ante.</p> </div>Buena pregunta. Puedes usar una función recursiva bien para eso. La función obtiene el punto inicial (tercero h2) y el punto final (cuarto h2). Luego itera sobre cada elemento dentro de estos dos puntos. Ahora he escrito la salida en la consola. Pero puedes concatenarlo en una cadena.
function getTextFromTo(rootNode, startNode, endNode) { let pastStartNode = false, reachedEndNode = false, textNodes = []; function getTextNodes(node) { if (node == startNode) { pastStartNode = true; } else if (node == endNode) { reachedEndNode = true; } else if (node.nodeType == 3) { if (pastStartNode && !reachedEndNode && !/^\s*$/.test(node.nodeValue)) { textNodes.push(node); } } else { for (var i = 0, len = node.childNodes.length; !reachedEndNode && i < len; ++i) { getTextNodes(node.childNodes[i]); } } } getTextNodes(rootNode); return textNodes; } const from = document.querySelector('div :nth-child(5)'); // from const to = document.querySelector('div :nth-child(11)'); // to const root = document.querySelector('div'); var textNodes = getTextFromTo(root, from, to); for (let i = 0, len = textNodes.length, div; i < len; ++i) { console.log(textNodes[i].data) } <div class="col-md-12"> <h2>title 1</h2> <ul><li></li></ul> <h2>title 2</h2> <ul><li></li></ul> <h2>Resume</h2> <p>text 1</p> <p>text 2</p> <p>text 3 this one</p> <p>text 4</p> <p>text 5 this one</p> <h2>next title</h2> </div>El creador de esta genial función es @TimDown. Lo acabo de adaptar. ¿Cómo puedo encontrar todos los nodos de texto entre dos nodos de elementos con JavaScript/jQuery?
Puedes usar expresiones regulares para ello
/(?<=<h2>Résumé<\/h2>)(.|\n)*?(?=<h2>)/g This will get all the text after <h2>Résumé<\/h2>' till next <h2> tag.