Question

我想做的是这个。无论我的脚本包含在页面上，都要注入一些HTML。那么无论在哪里：

<script src="http://demo.com/stats/stats.js"></script>

添加到页面，我可以输出

<div id="stats"></div>

在页面中的那个位置。

Answer 1

不要过分思考这个问题：

document.write('<div id="stats"></div>');

如果脚本是异步加载的，那么这将失败。

对于使用异步加载脚本的解决方案：

(function() {
  function addHtml() {
    var scripts = document.getElementsByTagName('script');
    for (var i = 0; i < scripts.length; i++) {
      if (scripts[i].src !== 'http://demo.com/stats/stats.js') {
        continue;
      }
      var div = document.createElement('div');
      div.id = 'stats';
      if (scripts[i].nextElementSibling) {
        scripts[i].parentNode.insertBefore(div, scripts[i].nextElementSibling);
      } else {
        scripts[i].parentNode.appendChild(div);
      }
    }
  }
  if (document.readyState === "complete") {
    addHtml();
  } else {
    document.addEventListener('DOMContentLoaded', addHtml, false);
  }
})()

注入包含脚本的HTML

1 个答案: