JS - 如何获取outerHTML textContent的字符串？

Question

JavaScript 中的问题 - 我使用 tagName 定义了一个元素，我想获取它的完整定义的字符串（如“

let elem = elementsArr[i].outerHTML.textContent;

它返回我未定义。 我需要一些帮助:)

只是想知道为什么我的代码不起作用

Answer 1

只是想知道为什么我的代码不起作用

因为.outerHTML没有方法.textContent，所以它返回undefined。

如果要获取元素的内容可以使用.innerHTML。

或者如果你只想要文本，你可以在元素上使用.textContent。

查看示例：

d = document.getElementById("d");
console.log(d.outerHTML);
console.log(d.innerHTML);
console.log(d.textContent); 

<div id="d"><p>Content</p><p>Further Elaborated</p></div>

Answer 2

.outerHTML返回一个字符串，String没有方法textContent，因为都是文本内容；

您可以使用 RegEx 或 function 清除 HTML - 见下文：

这将返回所有没有标签的文本:)

function strip(html) {
  var doc = new DOMParser().parseFromString(html, 'text/html');
  return doc.body.textContent || "";
}

demo = document.getElementById("demo");

console.log(strip(demo.outerHTML));

console.log(demo.outerHTML.replace(/<(?:.|\n)*?>/gm, '')); // even simpler

<div id="demo">
  <p>Some </p>
  <p>text <span>here</span></p>
</div>

参考：Strip HTML from Text JavaScript

编辑：您也可以只使用element.textContent，它会返回您想要的内容