Para dar un ejemplo de lo que quiero, imagina esta cadena:
$text = 'lorem ipsum <a href="/s/about">About us</a> lorem ipsum'; Si esta cadena contiene un vínculo de anclaje que tiene un href que comienza con / , reemplace el vínculo de anclaje completo con solo su texto interno. El resultado de esta función devolvería lo siguiente:
lorem ipsum Sobre nosotros lorem ipsum
He adaptado una función que he usado en el pasado para este propósito:
function replaceAnyQueriedElementByItsText(markup, selector) { const doc = (new DOMParser) .parseFromString(markup, "text/html"); doc .body .querySelectorAll(selector) .forEach(node => node .parentNode .replaceChild( document.createTextNode(node.text), node, ) ); return doc.body.innerHTML; }El problema con esto es que espera un selector, como una clase. Pero lo que quiero es seleccionar solo anclas que tengan un href específico. ¿Cómo puedo lograr esto?
Puede usar a[href^="/"] como selector. Entonces, como argumento para su función, sería:
replaceAnyQueriedElementByItsText(markup, 'a[href^="/"]');Ejemplo:
function replaceAnyQueriedElementByItsText(markup, selector) { const doc = new DOMParser().parseFromString(markup, "text/html"); doc.body.querySelectorAll(selector).forEach(node => node.parentNode.replaceChild( document.createTextNode(node.text), node, ) ); return doc.body.innerHTML; } // Example: let markup = 'lorem ipsum <a href="/s/about">About us</a> lorem ipsum'; let stripped = replaceAnyQueriedElementByItsText(markup, 'a[href^="/"]'); console.log(stripped);