如何在按钮单击异步上附加javascript

Question

为了动态追加脚本，我们需要创建script元素并添加script元素的src属性，最后将script元素追加到head标记（或任何其他标记）中。 但是行为是同步的，页面被阻塞，直到javascript完全加载为止。 我想知道是否有任何可能的解决方法，可以在不使用xhr的情况下异步嵌入javascript。

var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'urlofthescript';
$("#someElement").append( script );
//the above line blocks the UI until it gets loaded. Why?

Answer 1

除非您使用async属性 ，否则<script src="...">标记将始终是同步的。 但是，如果您<script>code goes here</script>插入<script>code goes here</script> ，则执行将立即开始（无需放弃JS线程即可）。 因此，将代码构造为字符串或通过AJAX加载，然后将document.createTextNode(code) ， document.createElement('script') ， appendChild代码加载到脚本中，然后将脚本加载到文档中。 另一种可能性是使用最近出现的一些出色的模块系统，例如RequireJS，为您解决所有这些问题。