浏览器端解析html方法汇总

370 阅读1分钟

DOMParser

let domparser = new DOMParser()​​;
let doc = domparser.parseFromString(htmlString, 'text/html');
return doc;

返回Document对象,对应的方法是用XMLSerializer从dom转html。这种方法性能比较低。

Document.implementation.createHTMLDocument 搭配 Element.innerHTML

let doc = document.implementation.createHTMLDocument();
doc.documentElement.innerHTML = htmlString;
return doc;

返回Document对象,这种方法性能中等。

HTML 内容模板 template 元素

let template = document.createElement('template');
template.innerHTML = htmlString;
return template.content;

返回DocumentFragment对象,适合解析html片段,template元素不会被渲染,性能最高。

XMLHttpRequest

XMLHttpRequest 支持从 URL 可寻址资源解析 XML 和 HTML,把responseType属性设置成"document"之后,在其response 属性中返回Document对象。