使用纯 JavaScript 从 Div 元素获取文本内容

尝试使用“value”属性检索 div 中的文本，您遇到了返回“undefined”的问题。要使用纯 JavaScript 成功提取文本内容，您可以使用以下方法：

“value”属性主要用于 input 元素，而不是 div 元素。要访问 div 的文本内容，您应该利用“innerHTML”或“textContent”属性。

使用“innerHTML”属性：

function test() {
  var t = document.getElementById('superman').innerHTML;
  alert(t);
}

此方法检索 div 中的整个内容，包括任何 HTML 标记。但是，如果您的 div 仅包含文本，则此方法是合适的。

或者，考虑使用“textContent”属性：

function test() {
  var t = document.getElementById('superman').textContent;
  alert(t);
}

“textContent”属性仅返回 div 中的文本内容，不包括任何 HTML 标记。在处理可能包含混合内容的 div 时，此选项特别有用。

例如，考虑以下 HTML：

  Some sample text.

使用“innerHTML”属性将返回以下内容：

var node = document.getElementById('test');

htmlContent = node.innerHTML;
// htmlContent = "Some sample text."

但是，利用“textContent”属性将产生：

textContent = node.textContent;
// textContent = "Some sample text."

更多详细信息和使用示例，请参考 MDN 提供的综合文档：

• [textContent](https://developer .mozilla.org/en-US/docs/Web/API/Node/textContent)
• [innerHTML](https://developer.mozilla.org/en-US/docs/Web/API/Element /innerHTML)