javascript - 检索隐藏元素的 innerText

Question

我试图获取元素的 innerText，但 Chrome 返回一个空字符串，因为我的元素被隐藏了。

Firefox 没有。

即使元素不可见，是否有办法在 Chrome 中检索 innerText？

console.log(document.querySelector('div').innerText + ':' + document.querySelector('div').innerHTML);

div {
  height: 0;
  overflow: hidden;
}

<div>
Hello, I'm <strong>empty!</strong>
</div>

老实说，我真的很惊讶 Chrome 会这样，这是一个错误吗？

https://jsfiddle.net/r8q2znc4/

Answer 1

您想使用 textContent为此，因为它从隐藏元素返回文本

document.querySelector('div').textContent

documentation指出

TextContent differs from innerText ...

Internet Explorer introduced node.innerText.
The intention is similar but with the following differences:

While textContent gets the content of all elements, including <script> and <style> elements, innerText does not.

innerText is aware of style and will not return the text of hidden elements, whereas textContent will.

As innerText is aware of CSS styling, it will trigger a reflow, whereas textContent will not.

这不是 Chrome 错误，而是 Firefox 错误，innerText不应返回隐藏元素的内容。