如何获取仅检索内容而不检索其中标签的锚标记内的 innerHTML？

Question

我要取回锚标签内容

<a id="1"><span class="italic">Hello There It Is Italic Text</span></a>

但是当我使用下面的 JS 代码时

var resultData = document.getElementById("1").inneHTML;
console.log(resultData);

我会得到的是

<span class="italic">Hello There It Is Italic Text</span>

作为结果数据

因为我希望结果数据是“你好，它是斜体文本” 因为我想在其他地方使用 resultData

甚至有些情况下可能会有多个span标签如

<a id="2"><span class="italic"><span class="highlight">Hello There It Is Italic Text</span></span></a>

或

<a id="3"><span class="italic">Hello There It Is <span class="highlight">Italic</span> Text</span></a>

所以我希望 resultData 在所有情况下都是 "Hello There It Is Italic"。我要的是没有任何子标签的锚标签的纯内容.

可以使用 pure Javascript 实现吗，如果可以，如何实现

请帮忙

Answer 1

获取元素的textContent属性

console.log(
  document.getElementById('1').textContent,
  document.getElementById('2').textContent,
  document.getElementById('3').textContent
)

<a id="1"><span class="italic">Hello There It Is Italic Text</span></a>
<a id="2"><span class="italic"><span class="highlight">Hello There It Is Italic Text</span></span></a>
<a id="3"><span class="italic">Hello There It Is <span class="highlight">Italic</span> Text</span></a>

Answer 2

要检索文本而不是整个标记，您应该使用 textContent，而不是 innerHTML。

如何获取仅检索内容而不检索其中标签的锚标记内的 innerHTML？

How to get the innerHTML inside the anchor tags which retrieves only content not the tags within?

javascript

anchor