Javascript文件的动态加载-吴统威的博客_html/css_WEB-ITnose

php中文网
发布: 2016-06-21 08:58:17
原创
1197人浏览过

Javascript文件的动态加载

作者 :towaywu

2016-01-28 17:26:24.0

29 浏览

类别 :HTML/CSS/JAVASCRIPT 编程语言

立即学习Java免费学习笔记(深入)”;

Javascript文件动态加载一直是比较困扰的一件事情,像网络上传的比较常见的做法:

代码名称

function loadjs(fileurl){  var sct = document.createElement("script");  sct.src = fileurl;  document.head.appendChild(sct);}
登录后复制

然后我们来测试一下结果:

代码名称

<html>   <head>      <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" media="screen" />   </head>   <body>       <script>
登录后复制
        function loadjs(fileurl){                      var sct = document.createElement("script");          sct.src = fileurl;          document.head.appendChild(sct);        }        loadjs("http://code.jquery.com/jquery-1.12.0.js");        loadjs("http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js")                loadjs("http://bootboxjs.com/bootbox.js")
登录后复制
       </script>   </body></html>
登录后复制

代码加载完后,会出现下图的错误.

jquery明明是加载在第一个处理,为什么还是报jQuery不存在的对象呢? 因为这样加载,相当于开启了三个线程,只是jquery这个文件先启动线程,而jquery执行完这个线程的时间,超过了后面两个时间. 因此后面执行完的,可能没能找到jquery这个对象.

然这种方式怎么处理呢? 其实文件的加载是有个状态处理的.文件的加载有个onload事件,就是可以监听文件是否加载完成的事件.

因此我们可以考虑这个方法来处理我们想要的结果.我们用直观的方式来处理.改进后的代码如下:

度加剪辑
度加剪辑

度加剪辑(原度咔剪辑),百度旗下AI创作工具

度加剪辑 63
查看详情 度加剪辑
                       
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号