使用DOMParser解析的脚本不执行

时间:2018-10-12 12:08:32

标签: javascript dom

当我使用document.createElement创建脚本元素并将其附加到document.head时,JavaScript成功执行:

var el = document.createElement('script');
el.text = "console.log('Hello World!')";
document.head.insertAdjacentElement('afterbegin', el);
// console output: "Hello World!"

但是,如果我使用DOMParser解析html字符串,然后将其firstElementChild附加到document.head,则JavaScript无法执行:

var parser = new DOMParser();
var htmlString = "<script>console.log('Bye World!')<\/script>";
var domEl = parser.parseFromString(htmlString, "text/xml").firstElementChild;
document.head.insertAdjacentElement('afterbegin', domEl);
// No console output

在两种情况下,<script>标记都被添加到document.head中。为什么在第二种情况下JavaScript无法执行?

1 个答案:

答案 0 :(得分:2)

由于DOMParser标记了script元素,因此它不会运行,因为DOMParser在禁用脚本的情况下解析了text/xml(及其他)(spec) 。是否应该运行脚本是与script元素相关的状态信息,这就是为什么它不会两次运行脚本的原因:

var el = document.createElement('script');
el.text = "console.log('Hello World!')";
document.head.insertAdjacentElement('afterbegin', el);
document.head.removeChild(el);
document.head.appendChild(el);