似魔鬼的 『 document.write 』

在平时的工作中，楼主很少用 document.write 方法，一直觉得 document.write 是个危险的方法。楼主不用，并不代表别人不用，最近给维护的项目添了一点代码，更加深了我对 "似魔鬼" 的document.wirte 方法的印象。

如果没接触过 document.write，可以先看下楼主以前写的 闲扯 『 document.write 』，里面有很多不错的链接。

这个案例是这样的，有一些相似的内页，内页顶部有个一样的 banner，实现方式是引用了同一个 js 文件，而 js 内部的实现是用了 document.write 方法。

假设每个内页 html 代码如下：

<!-- 公共头 -->
<script src="data2.js"></script>

<!-- 以下为内页其他内容 -->

假设 data2.js 如下：

document.write("world<br/>");

接着我们要在该 banner 前再加个 banner，且这个文件已经帮你写好了，和 data2.js 一样用 document.write 方式实现。

假设 data1.js：

document.write("hello</br>");

我们当然希望在页面上，hello 出现在 world 前，我们修改 html 代码如下：

<script src="data1.js"></script>
<script src="data2.js"></script>

<!-- 以下为内页其他内容 -->

一点问题没有，两个 js 依次执行，每个 js 执行内部 document.write 方法，将内容同步输出到页面。但是问题是内页很多，一个个修改非常麻烦（或者可以全局替换？）。想到一个办法，将 data1.js 写在 data2.js 中，如下：

document.write("<script src='data1.js'></" + "script>");
document.write("world<br/>");

但是，ie8 下先出现的是 world 啊！不同的浏览器会用不同的顺序加载啊！具体链接还是可以参考我的前文。最后我把 data1.js 中的内容复制出来全粘贴到 data2.js 中，才算解决问题，不然真的没有想到更好的办法（除了给每个内页 html 加上脚本引用这么一行）。

反正我写 js 尽量不用 document.write 吧，太坑了。

---

2016.10.11 add: chrome 54 似乎要禁止 document.write 的使用了 Why you should avoid using document.write, specifically for scripts injection