公共js在页面底部加载的注意事项介绍


Posted in Javascript onJuly 18, 2013

JavaScript脚本文件都放在页面底部加载,可以有效地加快页面的加载速度。
但是,php控制器一般这样写:

$this->load->view($HEADER); 
$this->load->view($MENU); 
$this->load->view($VIEW_SHOW, $data); 
$this->load->view($FOOTER);

$FOOTER是个共用模版,用于加载js及css文件。
$VIEW_SHOW作为主模版,则可能要单独写些js代码,这些代码通常需要使用公共文件的资源的话,把js写到$FOOTER的后面就不方便了,jQuery的$(document).ready又用不了。这时候,用window.onload就可以了,如下:
window.onload = function() { 
(function($) { 
function test() {alert(123);} 
//或写些基于jQuery的绑定什么的 
})(jQuery) 
};

但如果你想从window.onload外调用里面的函数,比如你想在这个窗口的子iframe中调用parent.test()是不会有结果的。
这时,变通一下,把函数作全局变量就可以了。
var test; // 全局作用域的声明 
window.onload = function() { 
(function($) { 
test = function() {alert(123);}; 
//或写些基于jQuery的绑定什么的 
})(jQuery) 
};

只在需要时,才把私有的函数改成全局的,是更安全的做法。
Javascript 相关文章推荐
最短的javascript:地址栏载入脚本代码
Oct 13 Javascript
JavaScript实现跨浏览器的添加及删除事件绑定函数实例
Aug 04 Javascript
jQuery+css实现的蓝色水平二级导航菜单效果代码
Sep 11 Javascript
javascript运动效果实例总结(放大缩小、滑动淡入、滚动)
Jan 08 Javascript
原生JS实现平滑回到顶部组件
Mar 16 Javascript
jQuery插件HighCharts实现2D柱状图、折线图的组合多轴图效果示例【附demo源码下载】
Mar 09 Javascript
原生js实现拖拽功能基本思路详解
Apr 18 Javascript
js监听html页面的上下滚动事件方法
Sep 11 Javascript
如何实现iframe父子传参通信
Feb 05 Javascript
Selenium执行Javascript脚本参数及返回值过程详解
Apr 01 Javascript
《javascript设计模式》学习笔记五:Javascript面向对象程序设计工厂模式实例分析
Apr 08 Javascript
js实现自定义滚动条的示例
Oct 27 Javascript
利用div+jquery自定义滚动条样式的2种方法
Jul 18 #Javascript
JavaScript实现复制功能各浏览器支持情况实测
Jul 18 #Javascript
GRID拖拽行的实例代码
Jul 18 #Javascript
去掉gridPanel表头全选框的小例子
Jul 18 #Javascript
gridpanel动态加载数据的实例代码
Jul 18 #Javascript
javaScript NameSpace 简单说明介绍
Jul 18 #Javascript
JS获取鼠标坐标的实例方法
Jul 18 #Javascript
You might like
咖啡的种类和口感
2021/03/03 新手入门
使用ob系列函数实现PHP网站页面静态化
2014/08/13 PHP
php实现删除指定目录下相关文件的方法
2014/10/20 PHP
Apache无法自动跳转却显示目录的解决方法
2020/11/30 PHP
yii2 url重写并隐藏index.php方法
2018/12/10 PHP
PHP示例演示发送邮件给某个邮箱
2019/04/03 PHP
js变量作用域及可访问性的探讨
2006/11/23 Javascript
如何在Web页面上直接打开、编辑、创建Office文档
2007/03/12 Javascript
javascript获得CheckBoxList选中的数量
2009/10/27 Javascript
Javascript 中的 && 和 || 使用小结
2010/04/25 Javascript
javascript在myeclipse中报错的解决方法
2013/10/29 Javascript
20个实用的JavaScript技巧分享
2014/11/28 Javascript
使用jQuery实现验证上传图片的格式与大小
2014/12/03 Javascript
JavaScript中关键字 in 的使用方法详解
2016/10/17 Javascript
Vue.js中兄弟组件之间互相传值实例
2017/06/01 Javascript
详解ES6中的代理模式——Proxy
2018/01/08 Javascript
基于ajax实现上传图片代码示例解析
2020/12/03 Javascript
修改NPM全局模式的默认安装路径的方法
2020/12/15 Javascript
[59:36]2018DOTA2亚洲邀请赛 4.3 突围赛 Secret vs VG 第二场
2018/04/04 DOTA
Python程序员鲜为人知但你应该知道的17个问题
2014/06/04 Python
教你使用python画一朵花送女朋友
2018/03/29 Python
详谈python3 numpy-loadtxt的编码问题
2018/04/29 Python
python 使用socket传输图片视频等文件的实现方式
2019/08/07 Python
python返回数组的索引实例
2019/11/28 Python
QML用PathView实现轮播图
2020/06/03 Python
python要安装在哪个盘
2020/06/15 Python
解决Python paramiko 模块远程执行ssh 命令 nohup 不生效的问题
2020/07/14 Python
CSS3制作精致的照片墙特效
2016/06/07 HTML / CSS
园林施工员岗位职责
2013/12/11 职场文书
通信工程专业毕业生推荐信
2013/12/25 职场文书
公务员保密承诺书
2014/03/27 职场文书
会计岗位说明书
2014/07/29 职场文书
幼儿园教师的自我评价范文
2014/09/17 职场文书
学生违反校规检讨书
2014/10/28 职场文书
小学总务工作总结
2015/08/13 职场文书
Python列表删除重复元素与图像相似度判断及删除实例代码
2021/05/07 Python