简单谈谈jQuery(function(){})与(function(){})(jQuery)


Posted in Javascript onDecember 19, 2014

开发jQuery插件时总结的一些经验分享一下。

一、先看
jQuery(function(){ });
全写为
jQuery(document).ready(function(){ });

意义为在DOM加载完毕后执行了ready()方法。

二、再看
(function(){ })(jQuery);
其实际上是执行()(para)匿名方法,只不过是传递了jQuery对象。

(function($) {…})(jQuery);

这里实际上是匿名函数,如下:

function(arg){…}
这就定义了一个匿名函数,参数为arg

而调用函数时,是在函数后面写上括号和实参的,由于操作符的优先级,函数本身也需要用括号,即:
(function(arg){…})(param)
这就相当于定义了一个参数为arg的匿名函数,并且将param作为参数来调用这个匿名函数

而(function($){…})(jQuery)则是一样的,之所以只在形参使用$,是为了不与其他库冲突,所以实参用jQuery
相当于funtion output(s){…};output(jQuery);或者var fn=function(s){…};fn(jQuery);

$(function(){…});

或者:

jQuery(function($) {

});

允许你绑定一个在DOM(不包含图片)文档载入完成后执行的函数。这个函数的作用如同$(document).ready()一样,只不过用这个函数时,需要把页面中所有需要在 DOM 加载完成时执行的$()操作符都包装到其中来。从技术上来说,这个函数是可链接的--但真正以这种方式链接的情况并不多。

全写是:
$(document).ready(function(){

});

三、总结

jQuery(function(){ });用于存放操作DOM对象的代码,执行其中代码时DOM对象已存在。不可用于存放开发插件的代码,因为jQuery对象没有得到传递,外部通过jQuery.method也调用不了其中的方法(函数)。
(function(){ })(jQuery);用于存放开发插件的代码,执行其中代码时DOM不一定存在,所以直接自动执行DOM操作的代码请小心使用。

Javascript 相关文章推荐
JavaScript 学习技巧
Feb 17 Javascript
javascript 基础篇1 什么是js 建立第一个js程序
Mar 14 Javascript
通过javascript获取iframe里的值示例代码
Jun 24 Javascript
js判断当前浏览器类型,判断IE浏览器方法
Jun 02 Javascript
js中style.display=""无效的解决方法
Oct 30 Javascript
jquery+CSS3实现3D拖拽相册效果
Jul 18 Javascript
jQuery zTree树插件动态加载实例代码
May 11 jQuery
基于jQuery对象和DOM对象和字符串之间的转化实例
Aug 08 jQuery
JS常用的几种数组遍历方式以及性能分析对比实例详解
Apr 11 Javascript
vue双向绑定及观察者模式详解
Mar 19 Javascript
利用js-cookie实现前端设置缓存数据定时失效
Jun 18 Javascript
Vue2.0 ES6语法降级ES5的操作
Oct 30 Javascript
jQuery多级弹出菜单插件ZoneMenu
Dec 18 #Javascript
使用jquery菜单插件HoverTree仿京东无限级菜单
Dec 18 #Javascript
jQuery实现视频作为全屏幕背景
Dec 18 #Javascript
JS实现判断滚动条滚到页面底部并执行事件的方法
Dec 18 #Javascript
浅析jQuery EasyUI中的tree使用指南
Dec 18 #Javascript
JavaScript实现弹出子窗口并传值给父窗口
Dec 18 #Javascript
JavaScript获取Url里的参数
Dec 18 #Javascript
You might like
PHP中其实也可以用方法链
2011/11/10 PHP
php explode函数实例代码
2012/02/27 PHP
深入HTTP响应状态码速查表的详解
2013/06/07 PHP
php打开文件fopen函数的使用说明
2013/07/05 PHP
PHP在引号前面添加反斜杠(PHP去除反斜杠)
2013/09/28 PHP
PHP判断变量是否为0的方法
2014/02/08 PHP
CI框架集成Smarty的方法分析
2016/05/17 PHP
PHP二维数组实现去除重复项的方法【保留各个键值】
2017/12/21 PHP
TP5(thinkPHP5框架)实现显示错误信息及行号功能的方法
2019/06/03 PHP
网站上面有这种切换效果
2006/06/26 Javascript
用jquery来定位
2007/02/20 Javascript
IE与Firefox在JavaScript上的7个不同句法分享
2011/10/30 Javascript
基于jQuery的计算文本框字数的代码
2012/06/06 Javascript
js 调用父窗口的具体实现代码
2013/07/15 Javascript
基于jquery编写的横向自适应幻灯片切换特效的实例代码
2013/08/06 Javascript
js 判断文件类型并控制表单提交示例代码
2013/11/14 Javascript
jQuery拖拽 & 弹出层 介绍与示例
2013/12/27 Javascript
将查询条件的input、select清空
2014/01/14 Javascript
在父页面得到zTree已选中的节点的方法
2015/02/12 Javascript
javascript实现客户端兼容各浏览器创建csv并下载的方法
2015/03/23 Javascript
纯JavaScript实现的分页插件实例
2015/07/14 Javascript
玩转Koa之koa-router原理解析
2018/12/29 Javascript
使用pygame模块编写贪吃蛇的实例讲解
2018/02/05 Python
Jupyter中直接显示Matplotlib的图形方法
2018/05/24 Python
Python实现对字典分别按键(key)和值(value)进行排序的方法分析
2018/12/19 Python
python用for循环求和的方法总结
2019/07/08 Python
Jupyter打开图形界面并画出正弦函数图像实例
2020/04/24 Python
无惧面试,带你搞懂python 装饰器
2020/08/17 Python
Django通过设置CORS解决跨域问题
2020/11/26 Python
Orvis官网:自1856年以来,优质服装、飞钓装备等
2018/12/17 全球购物
土建施工员岗位职责
2014/07/16 职场文书
2014财务人员自我评价范文
2014/09/21 职场文书
雷锋观后感
2015/06/10 职场文书
学校运动会感想
2015/08/10 职场文书
《我和小伙伴》教学反思
2016/02/20 职场文书
家长必看:义务教育,不得以面试 评测等名义选拔学生
2019/07/09 职场文书