js 文件引入实现代码


Posted in Javascript onApril 23, 2010

也不好麻烦让他们从新写一个方法,由于他们都引用了这个AA.js文件,想在这边在AA.js后执行一个函数自动把jq库引入,于是想到引入js文件方法:

getScript : function(s,call){ 
var el = UI.DC('script'); 
        if (call) { 
            el.onload =el.onreadystatechange=call; 
        } 
        UI.A(el,'type','text/javascript'); 
        UI.A(el,'src',s); 
        UI.GT(document,'head')[0].appendChild(el); 
    } 
/*UI.DC为创建对象,UI.A为属性赋值,GT为getElementsByTagName的简写*/

于是这样执行UI.getScript("js/jquery/jquery-1.4.2.min.js",function(){alert("载入成功")});

结果在IE和ff下确实弹出了载入成功,可当我再HTML中使用jq的时候在IE下怎么都执行不了,不断刷新偶尔还能执行,放在服务器上和在客户端的静态页面也有差别,但在火狐下没有问题.........

于是想到是不是jq文件在载入的时候和html载入是并行的,当jq载入成功之前HTML文件已经执行,于是在html的body结束之时添加

<script> 
alert("html前执行") 
</script>

执行发现确实是先弹出hmtl前执行,后弹出载入成功。在火狐下也是这样。上传到服务器上时感觉火狐的弹出会同时出现.....

于是开始不解,到底怎么设置才能确保jq文件载入完之后才能执行html body中的东东,怎么像在head中添加<script type="text/javascript" src="js/jquery.js"></script>那样引入文件..
思索总想到以前浏览一个页面是他用了一个loading文件引入许多js文件,在html中就可使用这些引入的文件函数,搜索查到了这个js文件内容为:

var Collapsar = { 
Version: '0.0.1', 
require: function(libraryName) { 
// inserting via DOM fails in Safari 2.0, so brute force approach 
document.write('<script type="text/javascript" src="'+libraryName+'"></script>'); 
}, 
load: function() { 
if((typeof Prototype=='undefined') || 
(typeof Element == 'undefined') || 
(typeof Element.Methods=='undefined') || 
parseFloat(Prototype.Version.split(".")[0] + "." + 
Prototype.Version.split(".")[1]) < 1.5) 
throw("The Prototype JavaScript framework 1.5.0+ is required"); $A(document.getElementsByTagName("script")).findAll( function(s) { 
return (s.src && s.src.match(/loader\.js(\?.*)?$/)) 
}).each( function(s) { 
var path = s.src.replace(/loader\.js(\?.*)?$/,''); 
var includes = s.src.match(/\?.*load=([a-z,]*)/); 
(includes ? includes[1] : "").split(',').each( 
function(include) { 
Collapsar.require(path+include+'.js') }); 
}); 
} 
} 
Collapsar.load();

调用的时候为<script type="text/javascript" src="js/loder.js?load=jquery,...,..."></script>这样等号后面的文件都可引入,其实是这句在关键的作用 document.write('<script type="text/javascript" src="'+libraryName+'"></script>');
刚看到有些疑惑write方法不是像文档内添加内容吗,内容应该在body标签中出现啊,实验发现如果是字符串确实出现在文档内,当如是script link等标签就出现在了head内;那在head中添加引用js文件难道和直接在head中一样载入他们之后才执行body中的内容....他载入和上面添加script有什么区别啊........

实验:在AA.js中添加:

UI.getsc=(function(){
document.write('<script type="text/javascript" src="js/jquery/jquery-1.4.2.min.js"></script>');
})()

让他自动执行,在body的第一行就引入jq的方法,实验确实成功了,在IE和在ff一样都可执行;
有时间继续实验...................

Javascript 相关文章推荐
javascript中的location用法简单介绍
Mar 07 Javascript
二级域名或跨域共享Cookies的实现方法
Aug 07 Javascript
jquery 笔记 事件
Nov 02 Javascript
jQuery写的日历(包括日历的样式及功能)
Apr 23 Javascript
用jQuery实现一些导航条切换,显示隐藏的实例代码
Jun 08 Javascript
jQuery实现页面滚动时动态加载内容的方法
Mar 20 Javascript
在Ubuntu系统上安装Ghost博客平台的教程
Jun 17 Javascript
基于JS实现仿百度百家主页的轮播图效果
Mar 06 Javascript
使用vue与jquery实时监听用户输入状态的操作代码
Sep 19 jQuery
Vue实现移动端页面切换效果【推荐】
Nov 13 Javascript
Vue-CLI项目中路由传参的方式详解
Sep 01 Javascript
详解ECMAScript2019/ES10新属性
Dec 06 Javascript
网页图片延时加载的js代码
Apr 22 #Javascript
基于jQuery的表格操作插件
Apr 22 #Javascript
JQuery实现的在新窗口打开链接的方法小结
Apr 22 #Javascript
JQuery 技巧和窍门整理(8个)
Apr 22 #Javascript
超级酷和最实用的jQuery实例收集(20个)
Apr 21 #Javascript
基于jquery的超简单上下翻
Apr 20 #Javascript
基于jquery1.4.2的仿flash超炫焦点图播放效果
Apr 20 #Javascript
You might like
php生成excel列名超过26列大于Z时的解决方法
2014/12/29 PHP
php利用ZipArchive类操作文件的实例
2020/01/21 PHP
表单提交验证类
2006/07/14 Javascript
javascript实现焦点滚动图效果 具体方法
2013/06/24 Javascript
js形成页面的一种遮罩效果实例代码
2014/01/04 Javascript
js实现键盘操作实现div的移动或改变的原理及代码
2014/06/23 Javascript
基于jquery固定于顶部的导航响应浏览器滚动条事件
2014/11/02 Javascript
JavaScript获取URL汇总
2015/06/08 Javascript
基于javascript编写简单日历
2016/05/02 Javascript
用JS实现图片轮播效果代码(一)
2016/06/26 Javascript
详解nodejs 文本操作模块-fs模块(三)
2016/12/22 NodeJs
bootstrap table配置参数例子
2017/01/05 Javascript
jQuery排序插件tableSorter使用方法
2017/02/10 Javascript
js实现文字跑马灯效果
2017/02/23 Javascript
详解webpack多页面配置记录
2018/01/22 Javascript
[52:20]VP vs VG Supermajor小组赛 B组胜者组决赛 BO3 第一场 6.2
2018/06/03 DOTA
使用优化器来提升Python程序的执行效率的教程
2015/04/02 Python
python 简单的绘图工具turtle使用详解
2017/06/21 Python
Python设计模式之命令模式简单示例
2018/01/10 Python
python安装pil库方法及代码
2019/06/25 Python
django-rest-swagger的优化使用方法
2019/08/29 Python
Python 文件操作之读取文件(read),文件指针与写入文件(write),文件打开方式示例
2019/09/29 Python
Python xlrd/xlwt 创建excel文件及常用操作
2020/09/24 Python
css3弹性盒子flex实现三栏布局的实现
2020/11/12 HTML / CSS
html5 postMessage解决跨域、跨窗口消息传递方案
2016/12/20 HTML / CSS
Html5 页面适配iPhoneX(就是那么简单)
2019/09/05 HTML / CSS
世界上最大的餐具公司:Oneida
2016/12/17 全球购物
酒店管理专业学生求职信
2013/09/27 职场文书
酒店副总经理岗位职责范本
2014/02/04 职场文书
2014优秀大学生简历自我评价
2014/09/15 职场文书
四风查摆问题及整改措施
2014/10/10 职场文书
晋江市委常委班子四风问题整改工作方案
2014/10/26 职场文书
机动车交通事故协议书
2015/01/29 职场文书
my.ini优化mysql数据库性能的十个参数(推荐)
2021/05/26 MySQL
还在手动盖楼抽奖?教你用Python实现自动评论盖楼抽奖(一)
2021/06/07 Python
利用python做数据拟合详情
2021/11/17 Python