公共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 相关文章推荐
认识延迟时间为0的setTimeout
May 16 Javascript
AngularJs动态加载模块和依赖注入详解
Jan 11 Javascript
jQuery弹层插件jquery.fancybox.js用法实例
Jan 22 Javascript
JS及PHP代码编写八大排序算法
Jul 12 Javascript
jQuery EasyUI封装简化操作
Sep 18 Javascript
AngularJS 最常用的八种功能(基础知识)
Jun 26 Javascript
JS在if中的强制类型转换方式
Jul 15 Javascript
浅谈vue父子组件怎么传值
Jul 21 Javascript
VUE简单的定时器实时刷新的实现方法
Jan 20 Javascript
vue组件文档(.md)中如何自动导入示例(.vue)详解
Jan 25 Javascript
微信小程序实现图片选择并预览功能
Jul 25 Javascript
js实现抽奖功能
Nov 24 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
基于PHP的简单采集数据入库程序【续篇】
2014/07/30 PHP
分享一段PHP制作的中文拼音首字母工具类
2014/12/11 PHP
PHP常用的三种设计模式汇总
2016/08/28 PHP
Javascript 通过json自动生成Dom的代码
2010/04/01 Javascript
比Jquery的document.ready更快的方法
2010/04/28 Javascript
JS 实现完美include载入实现代码
2010/08/05 Javascript
JavaScript使用indexOf获得子字符串在字符串中位置的方法
2015/04/06 Javascript
基于jQuery Circlr插件实现产品图片360度旋转
2015/09/20 Javascript
jQuery Real Person验证码插件防止表单自动提交
2015/11/06 Javascript
jQuery Mobile弹出窗、弹出层知识汇总
2016/01/05 Javascript
Bootstrap 填充Json数据的实例代码
2017/01/11 Javascript
实例解析js中try、catch、finally的执行规则
2017/02/24 Javascript
jQuery事件_动力节点Java学院整理
2017/07/05 jQuery
Angular-UI Bootstrap组件实现警报功能
2018/07/16 Javascript
详解如何运行vue项目
2019/04/15 Javascript
vue elementUI 表单校验功能之数组多层嵌套
2019/06/04 Javascript
JS中的一些常用的函数式编程术语
2019/06/15 Javascript
js时间转换毫秒的实例代码
2019/08/21 Javascript
使用layui实现树形结构的方法
2019/09/20 Javascript
Vue实现验证码功能
2019/12/03 Javascript
使用vuex较为优雅的实现一个购物车功能的示例代码
2019/12/09 Javascript
Angular5整合富文本编辑器TinyMCE的方法(汉化+上传)
2020/05/26 Javascript
[01:04:49]KG vs LGD 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
Python判断文本中消息重复次数的方法
2016/04/27 Python
Python判断两个list是否是父子集关系的实例
2018/05/04 Python
python版opencv摄像头人脸实时检测方法
2018/08/03 Python
Python利用递归实现文件的复制方法
2018/10/27 Python
python设定并获取socket超时时间的方法
2019/01/12 Python
在pycharm中创建django项目的示例代码
2020/05/28 Python
matplotlib图例legend语法及设置的方法
2020/07/28 Python
浅谈HTML5中dialog元素尝鲜
2018/10/15 HTML / CSS
医学专业毕业生个人的求职信
2013/12/04 职场文书
人民教师求职自荐信
2014/03/12 职场文书
2014年村官工作总结
2014/11/24 职场文书
《妈妈别哭,有我在》读后感3篇
2020/01/13 职场文书
SpringBoot前端后端分离之Nginx服务器下载安装过程
2022/08/14 Servers