公共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 相关文章推荐
jQuery获取css z-index在各种浏览器中的返回值
Sep 15 Javascript
JQuery.Ajax之错误调试帮助信息介绍
Jul 04 Javascript
用RadioButten或CheckBox实现div的显示与隐藏
Sep 21 Javascript
Javascript验证上传图片大小[前台处理]
Jul 18 Javascript
Node.js环境下JavaScript实现单链表与双链表结构
Jun 12 Javascript
vue学习之mintui picker选择器实现省市二级联动示例
Oct 12 Javascript
mpvue构建小程序的方法(步骤+地址)
May 22 Javascript
原生JS实现的自动轮播图功能详解
Dec 28 Javascript
基于vue.js实现分页查询功能
Dec 29 Javascript
php结合js实现多条件组合查询
May 28 Javascript
深入理解redux之compose的具体应用
Jan 12 Javascript
vue使用exif获取图片旋转,压缩的示例代码
Dec 11 Vue.js
利用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
一个php作的文本留言本的例子(四)
2006/10/09 PHP
解析coreseek for sphinx的使用
2013/06/21 PHP
Symfony学习十分钟入门经典教程
2016/02/03 PHP
PHP创建/删除/复制文件夹、文件
2016/05/03 PHP
Yii+MYSQL锁表防止并发情况下重复数据的方法
2016/07/14 PHP
thinkphp中U方法按路由规则生成url的方法
2018/03/12 PHP
在视频前插入广告
2006/11/20 Javascript
filters.revealTrans.Transition使用方法小结
2010/08/19 Javascript
深入理解javascript中defer的作用
2013/12/11 Javascript
js使用html()或text()方法获取设置p标签的显示的值
2014/08/01 Javascript
js实现Select列表内容自动滚动效果代码
2015/08/20 Javascript
jquery+json实现数据二级联动的方法
2015/11/28 Javascript
jquery实现图片切换代码
2016/10/13 Javascript
详解使用nvm管理多版本node的方法
2017/08/30 Javascript
vue2.0 实现导航守卫(路由守卫)
2018/05/21 Javascript
JavaScript Canvas实现验证码
2020/08/02 Javascript
Vue实现简易翻页效果源码分享
2018/11/08 Javascript
性能优化篇之Webpack构建速度优化的建议
2019/04/03 Javascript
JavaScript内置对象math,global功能与用法实例分析
2019/06/10 Javascript
一些可能会用到的Node.js面试题
2019/06/15 Javascript
vue 路由子组件created和mounted不起作用的解决方法
2019/11/05 Javascript
NUXT SSR初级入门笔记(小结)
2019/12/16 Javascript
js实现飞机大战游戏
2020/08/26 Javascript
深入了解Vue3模板编译原理
2020/11/19 Vue.js
[01:11:27]2018DOTA2亚洲邀请赛小组赛 A组加赛 Newbee vs Optic
2018/04/03 DOTA
浅谈pycharm的xmx和xms设置方法
2018/12/03 Python
浅谈python常用程序算法
2019/03/22 Python
用uWSGI和Nginx部署Flask项目的方法示例
2019/05/05 Python
Jupyter安装拓展nbextensions及解决官网下载慢的问题
2021/03/03 Python
意大利和国际奢侈品牌购物网站:Suitnegozi.com
2021/01/15 全球购物
如何将字串String转换成整数int
2015/02/21 面试题
DBA的职责都有哪些
2012/05/16 面试题
关于责任的演讲稿
2014/05/20 职场文书
领导班子个人查摆问题对照检查材料
2014/10/02 职场文书
团员个人年度总结
2015/02/26 职场文书
民事二审代理词
2015/05/25 职场文书