Question

例如，如果我有：

'<html><body><p>hello</p></body></html>'

如何将其解析为实际的html元素？

我尝试了类似下面的内容：

getNodeType(element) {
  const temp = document.createElement('div');
  temp.innerHTML = element;
  if (temp.firstChild) return temp.firstChild.nodeName;
  else return null;
}

哪种方法效果很好，但我无法解析<html>，<body>和<title>等标记，因为它们无法包含在div中。我也试过DOMParser，但它包装了html，head和body标签中的所有内容，所以我无法识别实际的元素。

宁愿不使用jQuery，也不完全反对它。

非常感谢任何建议，非常感谢！

Answer 1

您应该使用DOMParser来实现此目的：

parser = new DOMParser();
doc = parser.parseFromString('<html><body><p>hello</p></body></html>', 'text/html');
console.log(doc.getElementsByTagName('p')[0])
// will print: <p>hello</p>

此处有更多信息：https://developer.mozilla.org/en/docs/Web/API/DOMParser

Answer 2

不确定为什么你遇到DOMParser的问题，它应该可以正常工作

const parser = new DOMParser();
const doc = parser.parseFromString('<html><body><p>hello</p></body></html>', 'text/html')
console.log(doc.firstChild.nodeName);

如何将元素的字符串表示形式解析为实际的html元素？

2 个答案: