JavaScript动态加载JS文件的loadScript函数实现
作者:纸飞机时间:2026-10-29 10:07:49浏览:524
本文介绍了一个用于动态加载JavaScript文件的轻量级函数loadScript。该函数通过创建script标签并设置src属性实现脚本异步加载,同时兼容旧版IE的readyState检测以支持回调函数。文中提供了完整源码及结合Google Analytics异步加载的实际应用示例,帮助开发者优化页面加载性能。
loadScript函数源码解析
以下是相关代码实现:
<script type="text/javascript">
/**
* 定义函数 loadScript
* 版权所有 (C) 2006 Dao Gottwald
*
* 本库为自由软件;您可以按照自由软件基金会发布的
* GNU 通用公共许可证(Lesser General Public
* License)的条款进行重新分发和/或修改;许可证版本为
* 2.1 版,或(根据您的选择)任何后续版本。
*
* 本库的发布旨在希望其有用性,
* 但不提供任何形式的担保;甚至不包括隐含的
* 适销性或特定用途适用性的担保。请参阅 GNU
* 通用公共许可证以获取更多信息。
*
* 您应该已经随本库收到了一份 GNU 通用公共许可证
* 的副本;如果没有,请写信给 Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
*
* 联系信息:
* Dao Gottwald <dao at design-noir.de>
* Herltestra?e 12
* D-01307, Germany
*
* @version 1.5
* @url http://design-noir.de/webdev/JS/loadScript/
*/
function loadScript (url, callback) {
var script = document.createElement('script');
script.type = 'text/javascript';
/* 应为 application/javascript
* http://www.rfc-editor.org/rfc/rfc4329.txt
* http://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=84613
*/
if (callback)
script.onload = script.onreadystatechange = function() {
if (script.readyState && script.readyState != 'loaded' && script.readyState != 'complete')
return;
script.onreadystatechange = script.onload = null;
callback();
};
script.src = url;
document.getElementsByTagName('head')[0].appendChild (script);
}
</script> 实例:
Google Analytics异步加载示例
以下是相关代码实现:
<script type="text/javascript">
// 防止 Google Analytics 减慢页面加载速度
window.addEventListener ('load', function() {
loadScript ('http://www.google-analytics.com/urchin.js', function() {
window._uacct = 'UA-xxxxxx-x';
urchinTracker();
});
}, false);
</script>作者最新文章
JS动态构建复杂嵌套JSON对象的方法
2026-11-05 15:41:52
JS负数取余为什么是负数?详解余数与模运算区别
2026-11-05 13:34:41
JS 解压出现乱码或报错怎么解决?
2026-11-05 12:32:38
JS 中 startsWith、indexOf 与正则判断字符串前缀的对比
2026-11-04 22:19:43
JS解析Excel后怎么将数据转换为JSON格式
2026-11-04 20:58:28
