将数据转换为HTML对象的最佳方法

Question

哪个更好，为什么？

var x = DOMParser().parseFromString(data, "text/html").body.firstChild;
var y = Object.assign(document.createElement("x"), {innerHTML: data}).firstChild;

Answer 1

如果源数据不可信，则应该不使用createElement方法，因为设置onerror时可以调用内联处理程序（例如innerHTML）：

const data = `<img src="badsrc" onerror="console.log('evil')"></img>`;

// OK:
console.log('about to use DOMParser');
var x = new DOMParser().parseFromString(data, "text/html").body.firstChild;

// Potentially unsafe:
console.log('about to use createElement');
var y = Object.assign(document.createElement("x"), {innerHTML: data}).firstChild;