JS - 对于字符串中具有特定 URL 的每个锚链接，用其文本替换锚链接

Question

举一个我想要的例子，想象一下这个字符串：

$text = 'lorem ipsum <a href="/s/about">About us</a> lorem ipsum';

如果此字符串包含具有以/开头的 href 的锚链接，则仅将整个锚链接替换为其内部文本。 function 的结果将返回以下内容：

lorem ipsum 关于我们 lorem ipsum

为此，我改编了过去使用过的 function：

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;
}

这个问题是，这需要一个选择器，例如 class。但是我想要 select 只有具有特定 href 的锚点。 我怎样才能做到这一点？

Answer 1

您可以使用a[href^="/"]作为选择器。 因此，作为您的 function 的参数，它将是：

replaceAnyQueriedElementByItsText(markup, 'a[href^="/"]');

例子：

 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);