`
543334061
  • 浏览: 11298 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

$(function(){})与(function($){})(jQuery)的区别

 
阅读更多
1、(function($) {…})(jQuery);

1)、原理:


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

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

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

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

2)、作用(非常有用):

这种写法的最大好处是形成闭包。在(function($) {…})(jQuery)在内部定义的函数和变量只能在此范围内有效。
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>demo1</title>
		<script type="text/javascript" src="js/jquery-1.8.3.min.js" ></script>
		<script type="text/javascript">
		
			$(function(){
				var i=2;
				function init(){
					alert("外部"+i);
				}
				;(function($){
					var i=3;
					function init(){
						alert("内部"+i);
					}
					init();
				})(window.jQuery);
				init();
			})
			
		</script>
	</head>
	<body>
		<input type="text" id="name" name="name"  placeholder="123" maxlength="10"> 
	</body>
</html>

执行结果:内部3
         外部2

2、$(function(){…});   jQuery(function($) {…});  $(document).ready(function(){…})

这三个的作用是一样的,本人比较需要用第一种、书写简单。
分享到:
评论

相关推荐

    jquery 用法 (function($) {})(jQuery);的用法

    页面前端 jquery 用法 (function($) {})(jQuery);的用法

    jQuery(document).ready(function($) { });的几种表示方法

    **第五种:jQuery的`$(document).ready()`与`window.onload()`的区别** - `$(document).ready()`在DOM元素加载完毕后立即执行,不需要等待所有资源(如图片、CSS等)加载完成。 - 相比之下,`window.onload()`需要...

    JQuery中$(function()的用法

    JQuery中$(function()的用法

    怎样理解(function($){...})(jQuery)

    本示例主要用于揭示Jquery中的(function($){...})(jQuery),欢迎下载!!!相关博客:http://blog.csdn.net/gaohuanjie/article/details/38268831

    Jquery中$与$.fn的区别实例.zip

    在jQuery库中,`$`和`$.fn`都是核心组成部分,但它们有着不同的用途和功能。...通过实践和探索`Jquery中$与$.fn的区别实例`中的示例,你将能深入理解这两个核心组件的用法和它们在实际项目中的应用。

    ajaxFileUpload 报这错jQuery.handleError is not a function

    3. **检查ajaxFileUpload插件**:确保你正在使用的ajaxFileUpload插件是最新的,并且与你当前的jQuery版本兼容。如果插件需要更新,可以从官方源或者GitHub仓库获取最新版本。 4. **调试**:打开浏览器的开发者工具...

    jQuery中(function($){})(jQuery)详解

    在jQuery的代码中,我们经常看到一种特殊的语法结构 `(function($){})(jQuery)`,这被称为立即执行函数表达式(IIFE,Immediately Invoked Function Expression)。这个结构在jQuery插件开发中尤为常见,因为它提供...

    Jquery $when done then的用法详解

    对于$.ajax请求来说,如果层级比较多,程序看起来会比较乱,而为了解决这种问题,才有了$...success: function (data) { $.ajax({ url: /home/GetProduct, dataType: JSON, type: GET, success: function (data) { $.a

    jQueryPost页面不能刷新

    jQuery.post(url, data, function(result) { // 成功回调 }, 'json').fail(function(xhr, status, error) { // 错误回调 console.error('Error:', status, error); }); ``` 这样可以捕获并处理可能出现的...

    jquery $.fn.extend

    通过这种方式,我们能够构建自己的事件系统,使其与jQuery的事件处理机制无缝集成。 ### 总结 `$.fn.extend`是jQuery的核心扩展机制,它使得开发者可以轻松地为jQuery添加新的功能,提高代码复用性和可维护性。...

    jQuery在header中设置请求信息的方法

    jquery是js的类库,js本身不能操作header,因为js是在浏览器加载页面过程中才开始执行的header需要服务器端执行操作 如果是ajax,是可以设置header $.ajax({ url: "", data: {}, type: "GET", beforeSend: ...

    jquery与js函数冲突的两种解决方法.docx

    // 这里的$代表jQuery,不会与全局的$冲突 $(function() { $("div").click(function() { alert($(this).text()); }); }); })(jQuery); // 传入jQuery实例 // 全局作用域中,$仍然代表其他库 alert($("cr")); ...

    jquery.processing.plugin.js以及详细演示

    **jQuery Processing Plugin.js详解与应用实例** jQuery Processing Plugin.js 是一个基于 jQuery 和 Processing.js 的插件,它将Processing的强大功能引入到Web开发中,使得在网页上创建动态、交互式的图形变得...

    jquery.table2excel.js

    jquery.table2excel.js,一款挺好用的javascript导出插件,需要jquery-1.7.1.min.js的支持。使用方法: $(document).ready(function() { //导出excel $("#output").click(function(){ var myDate = new Date(); ...

    jquery手冊--jquery.chm

    jQuery $(Function fn) $(document)的简写方式。 jQuery $(String expr,Element|jQuery context) 这个函数接收一个包含CSS或基本的XPath选择符的字符串,然后用这个字符串去匹配一组元素。 jQuery $.extent(Object...

    jquery快速入门实例

    ### 1.2 jQuery 选择器与样式操作 jQuery 提供了丰富的选择器,例如 `'#wrap&gt;p:first'` 用于选取 `id` 为 `wrap` 的 `div` 中的第一个 `p` 元素。`.addClass()` 方法可以添加CSS类,`.css()` 方法用于设置样式。...

    jquery-2.table2excel

    $("#output").click(function(){ var myDate = new Date(); $("#example").table2excel({ exclude: ".noExl", name: "Excel Document Name.xlsx", filename: myDate.toLocaleString(), exclude_img: true, ...

    Jquery ready function Tester Source!

    Jquery ready function Tester Source!

    seajs加载jquery时提示$ is not a function该怎么解决

    当使用Sea.js模块加载器加载jQuery时,经常会出现 "$ is not a function" 的错误提示。这个问题主要发生在使用Sea.js来加载jQuery时,尤其是在Sea.js依赖的CMD(Common Module Definition)模块规范和jQuery默认的...

Global site tag (gtag.js) - Google Analytics