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

标签 javascript html

例如,如果我有:

'<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,但也不完全反对它。

非常感谢任何建议,非常感谢!

最佳答案

您应该使用 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

关于javascript - 如何将元素的字符串表示形式解析为实际的 html 元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45471420/

相关文章:

javascript - 如何将 JavaScript 添加到我的 Tumblr 博客上的每个非索引页面?

javascript - 使用以前的对象值返回新的 JS 对象

javascript - 禁用 Javascript 的浏览器的模态备份

javascript - jquery动态分割字符串并包装到类中

javascript - 按下 JQM 列表中的按钮

html - 在手机上查看时图像消失

javascript - 如何临时添加一个CSS样式?

javascript - 来自 bower_components 的引用文件

javascript - 灯箱关闭在 body 内

javascript - sinatra + angular.js + 加载模板