动态JavaScript是否同步添加

Is dynamic javascript added synchronously or not?

本文关键字：添加 同步 是否 JavaScript 动态      更新时间：2023-09-26

此外，何时加载代码，何时加载.src属性或追加元素。 举例说明：

var test = document.createElement('script');
test.src = 'some_path'; 
// is code loaded here?
document.head.appendChild(test);
// or here?
...
// or is it an asynch operation?

动态创建脚本元素时，在将元素插入文档之前，不会加载或执行源文件。脚本的加载是异步的。这意味着您的代码执行以下操作：

  1. 创建脚本元素
  2. 分配源属性
  3. 将元素放入文档中
  4. 开始异步加载源文件
  5. 加载后，执行脚本

编辑：感谢您指出设置异步属性对脚本的加载行为没有任何影响。我从未真正使用它并假设它会起作用，但它显然没有。我删除了声称它会的部分。我举了一个例子来说明这一点。

Javascript 从上到下运行，除非它是一个函数、对服务器的异步调用，或者在等待某个事件的闭包中(即：window.load()

您的代码如下所示：

var test = document.createElement('script');
//declare variable test to create script element
test.src = 'some_path'; 
//define element with src attribute 'some_path'
document.head.appendChild(test);
//place script element in head block

尽管我建议在服务器端创建动态脚本块，以避免由于异常和高负载/超时可能性而导致的复杂性。

您可以在Firebug和Chrome Dev工具中插入断点，以逐步浏览脚本并查看正在发生的事情。 更多信息： https://developers.google.com/chrome-developer-tools/docs/javascript-debugging

相关文章：