jQuery新手:jQuery(function($){...})是什么意思?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery新手:jQuery(function($){...})是什么意思?相关的知识,希望对你有一定的参考价值。
我知道在jQuery中,$(callback)
与jQuery(callback)
相同,它与$(document).ready()
具有相同的效果。
怎么样
jQuery(function($) {
});
有人可以向我解释一下这种功能是什么意思吗?
它有什么作用?
这个和$(callback)
有什么区别?
这个和$(function())
有什么区别?
jQuery(function($) {
});
是这三者中最安全的版本。它使$
成为局部变量,从而优雅地避免与可能使用$
符号的任何其他变量冲突。
我认为最近也添加了它,不记得以前看过了。
这些函数都做同样的事情 - 在DOM准备好时执行一些代码。 $(document).ready(function(){})
是原始的,它匹配底层的javascript API。
接受函数作为参数的“$”和“jQuery”被创建为快捷方式,以避免重复这种常见的构造。接受一个接受$作为其第一个参数的函数是另一种语法糖 - 现在你可以方便地完成闭包而无需自己动手。
$(function())
是语法错误。$()
创建一个空的jQuery对象。- 当DOM准备好时,
$(document).ready(function() { ... })
执行给定的函数 $(function() { ... })
是同一件事的捷径jQuery(function($) { ... })
也这样做,但它也使$
可以在函数内部使用,无论它设置在外面。
所以我对此进行了更正,如果您阅读第一条评论,则会给出一些背景信息。
jQuery(function() {
// Document Ready
});
(function($) {
// Now with more closure!
})(jQuery);
我不是100%肯定,但我认为这只是将jQuery对象传递给闭包。我会在谷歌上挖掘一下,看看我是对还是错,并会相应更新。
编辑:
我非常正确,但这里直接来自他们的网站:
http://docs.jquery.com/Plugins/Authoring
“我知道并喜欢的令人敬畏的美元符号在哪里?它仍然在那里,但要确保你的插件不会与其他可能使用美元符号的库发生碰撞,将jQuery传递给自动执行函数是最佳做法(封闭)将其映射到美元符号,以便它不能被执行范围内的另一个库覆盖。“
当你调用主jQuery工厂函数(作为jQuery(<something>)
或常见的快捷方式$(<something>)
)时,它根据<something>
的类型决定做什么。
如果您将字符串作为<something>
传递,则假定它是一个选择器规范,并将返回与该选择器匹配的元素的jQuery列表。
如果传递一个jQuery对象(表示一个元素列表,即从之前调用jQuery返回的对象),它将只返回该对象(实际上这是一个非操作)。
如果你传递一个DOM元素,它将返回一个只包含该元素的jQuery列表(因此你可以将jQuery方法应用于该元素)。这是$(document).ready()
发生的事情 - 你传递工厂函数DOM元素“document”,它返回一个表示该元素的jQuery对象,并使用该对象的ready()方法将事件处理函数添加到所有的ready事件中列表中的DOM元素(在这种情况下只是一个,document
)。
如果你传递一个函数,这只是“当一切准备就绪时运行它”的简写,所以$(function() { ... });
相当于$(document).ready(function() { ... });
首先,jQuery()
与$(document).ready()
不同
$()
是jQuery()
的捷径
和...
$(function(){ ...});
是$(document).ready(function(){ ... });
的捷径
从而:
jQuery(function(){ ... })
功能与...相同
$(document).ready(function({ ... });
但...
jQuery('#foo').css("background-color", "#f00");
不会起到相同的作用
$(document).ready('#foo').css("background-color", "#f00");
所以...
jQuery()
与$(document).ready()
不同
以上是关于jQuery新手:jQuery(function($){...})是什么意思?的主要内容,如果未能解决你的问题,请参考以下文章
jQuery: $(document).on(event, name as selector, function [重复]