Question

我想在头顶做一个AJAX调用，一旦完成，根据ajax调用的结果插入一个脚本及其内容。像这样：

var request = new XMLHttpRequest();
  request.open('GET', 'https://mypage.com/');
  request.setRequestHeader('Accept', 'application/json');
  request.onreadystatechange = function () {
    if (this.readyState === 4 && this.status === 200) {
      var result = JSON.parse(this.responseText);
      if (result.foo === 'bar') {
        insertScript('bar');
      } else {
        insertScript('not bar');
      }
    }
  };
  request.send();
}

插入脚本代码：

function insertScript (msg) {
  var script = document.createElement("script");
  var content = "console.log('" + msg + "');";
  var inlineScript = document.createTextNode(content);
  script.appendChild(inlineScript);
  document.head.appendChild(script);
}

所以现在我想知道：脚本何时执行？我希望它尽可能快地执行。它附着在头上。如果dom-parser已经到达身体怎么办？它会先停止并在头部执行新脚本吗？它会渲染所有内容然后执行脚本吗？

Answer 1

它会立即执行脚本。但是，为了安全起见，您可以注入自执行功能，如下所示： -

var script = document.createElement("script");
var content = "(function selfCallableFunction(){console.log('" + msg + "');})()";
var inlineScript = document.createTextNode(content);
script.appendChild(inlineScript);
document.head.appendChild(script);

JS：动态插入脚本什么时候执行？

1 个答案: