公共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 相关文章推荐
Js+XML 操作
Sep 20 Javascript
jQuery中的ajax async同步和异步详解
Sep 29 Javascript
jQuery CSS3自定义美化Checkbox实现代码
May 12 Javascript
Three.js快速入门教程
Sep 09 Javascript
让编辑器支持word复制黏贴、截屏的js代码
Oct 17 Javascript
JavaScript的new date等日期函数在safari中遇到的坑
Oct 24 Javascript
angularjs 实现带查找筛选功能的select下拉框实例
Jan 11 Javascript
快速处理vue渲染前的显示问题
Mar 05 Javascript
JavaScript类的继承方法小结【组合继承分析】
Jul 11 Javascript
微信小程序textarea层级过高的解决方法
Mar 04 Javascript
关于vue组件事件属性穿透详解
Oct 28 Javascript
JS实现简单省市二级联动
Nov 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
PHP输出控制功能在简繁体转换中的应用
2006/10/09 PHP
wiki-shan写的php在线加密的解密程序
2008/09/07 PHP
9个PHP开发常用功能函数小结
2011/07/15 PHP
你不知道的文件上传漏洞php代码分析
2016/09/29 PHP
利用php_imagick实现复古效果的方法
2016/10/18 PHP
PHP实现与java 通信的插件使用教程
2019/08/11 PHP
解决laravel-admin 自己新建页面里 js 需要刷新一次的问题
2019/10/03 PHP
PHP中用Trait封装单例模式的实现
2019/12/18 PHP
js实现翻页后保持checkbox选中状态的实现方法
2012/11/03 Javascript
js操作输入框中选择内容兼容IE及其他主流浏览器
2014/04/22 Javascript
jQery使网页在显示器上居中显示适用于任何分辨率
2014/06/09 Javascript
JS动态添加iframe的代码
2015/09/14 Javascript
学习JavaScript设计模式(策略模式)
2015/11/26 Javascript
基于d3.js实现实时刷新的折线图
2016/08/03 Javascript
KnockoutJS 3.X API 第四章之表单textInput、hasFocus、checked绑定
2016/10/11 Javascript
jquery平滑滚动到顶部插件使用详解
2017/05/08 jQuery
基于dataset的使用和图片延时加载的实现方法
2017/12/11 Javascript
JavaScript实现身份证验证代码实例
2019/08/26 Javascript
微信小程序 冒泡事件原理解析
2019/09/27 Javascript
python利用多种方式来统计词频(单词个数)
2019/05/27 Python
Python猴子补丁Monkey Patch用法实例解析
2020/03/23 Python
Python文件操作及内置函数flush原理解析
2020/10/13 Python
python 基于selectors库实现文件上传与下载
2020/12/31 Python
python在协程中增加任务实例操作
2021/02/28 Python
HTML5 Canvas中绘制椭圆的4种方法
2015/04/24 HTML / CSS
澳大利亚领先的在线葡萄酒零售商:Get Wines Direct
2018/03/27 全球购物
Ramy Brook官网:美国现代女装品牌
2019/06/18 全球购物
应届生法律求职信
2013/10/22 职场文书
青年志愿者事迹材料
2014/02/07 职场文书
安全生产承诺书
2014/03/26 职场文书
班主任寄语大全
2014/04/04 职场文书
文员求职信
2014/07/15 职场文书
学校教师培训工作总结
2015/10/14 职场文书
Canvas三种动态画圆实现方法说明(小结)
2021/04/16 Javascript
python库sklearn常用操作
2021/08/23 Python
「天才王子的赤字国家重生术」妮妮姆·拉雷粘土人开订
2022/03/21 日漫