javascript document.write 与 appendChild
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22172589/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
document.write vs appendChild
提问by Uri Chandler
Is there a difference in load \ execution time between the following two ways of adding a script to a page ?
以下两种向页面添加脚本的方法在加载\执行时间上是否存在差异？
<script>
document.write('<script src=someScript.js></script>');
</script>
vs this:
与这个：
<script>
var s=document.createElement('script');
s.src='someScript.js';
document.body.appendChild(s);
</script>
assuming both are added at the same location on the page (before the closing body tag).
假设两者都添加在页面上的相同位置（在结束正文标记之前）。
Any info is appreciated!
任何信息表示赞赏！
Edit:Thanks all for the comments and answers. I'm actually looking for specific information on differences in load time and\or execution (if there are any?). Also, I can place both while the DOM is still being parsed. Thanks again for any pointers on this!!
编辑：感谢大家的评论和回答。我实际上正在寻找有关加载时间和/或执行差异的特定信息（如果有的话？）。此外，我可以在 DOM 仍在解析时放置两者。再次感谢您对此的任何指示！！
采纳答案by Question Overflow
I came across this while researching for the same. After some testing, I conclude that, yes, there is a majordifference between those two methods. On modern browsers, this is not so much on the loading or execution time but the sequence in which the scripts are being evaluated. For example, if you have the following:
我在研究相同的时候遇到了这个。经过一些测试，我得出结论，是的，这两种方法之间存在重大差异。在现代浏览器上，这与加载或执行时间无关，而是与评估脚本的顺序有关。例如，如果您有以下内容：
someScript.js
someScript.js
console.log('2');
index1.htm
index1.htm
<script>
console.log('1');
var script = document.createElement('script');
script.src = 'someScript.js';
document.write(script.outerHTML);
</script>
<script>
console.log('3');
</script>
index2.htm
index2.htm
<script>
console.log('1');
var script = document.createElement('script');
script.src = 'someScript.js';
document.body.appendChild(script);
</script>
<script>
console.log('3');
</script>
Running index1.htmon your console will give you the sequence "1, 2, 3". Running index2.html will give you the sequence "1, 3, 2" instead. If there are external scripts being requested, these will load ahead of the dynamically requested someScriptfor both methods.
index1.htm在您的控制台上运行将为您提供序列“1、2、3”。运行 index2.html 将为您提供序列“1,3,2”。如果有外部脚本被请求，这些将someScript在两种方法的动态请求之前加载。
Important thing to note is the order of execution. As Hyman noted in the comment, using document.writeis frowned upon. This is true if your scripts are not located at the end of the html document as it will block the rendering of your webpage. I am not so sure, if this is still the case if your scripts are at the bottom though.
需要注意的重要一点是执行顺序。正如Hyman在评论中指出的那样，使用document.write是不受欢迎的。如果您的脚本未位于 html 文档的末尾，则会出现这种情况，因为它会阻止您的网页呈现。我不太确定，如果您的脚本位于底部，情况是否仍然如此。
Nevertheless, you can still use a callback function to enforce order in the execution of javascript.
尽管如此，您仍然可以使用回调函数来强制执行 javascript 的顺序。
回答by Vicky Gonsalves
document.write()writes in the document where it is executed.
Whereas appendChildappends the element to the specified element.
document.write()写在执行它的文档中。
而appendChild将元素附加到指定的元素。
