jQuery 新手:jQuery(function($) { ... }) 是什么意思?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6454631/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 20:53:10  来源:igfitidea点击:

jQuery newbie: what does jQuery(function($) { ... }) means?

jqueryjquery-uijquery-selectors

提问by Leem

I know in jQuery, $(callback)is the same as jQuery(callback)which has the same effect as $(document).ready().

我知道在 jQuery 中,$(callback)jQuery(callback)具有相同效果的$(document).ready().

How about

怎么样

jQuery(function($) {

 });

Can some one explain to me what does this kind of function mean?

有人可以向我解释这种功能是什么意思吗?

What does it do?

它有什么作用?

what is the difference between this one and $(callback)??

这个和有什么区别$(callback)??

what is the difference between this one and $(function())??

这个和有什么区别$(function())??

采纳答案by George Karpenkov

jQuery(function($) {

});

is the safest version of all three. It makes $the local variable and thus gracefully avoids the conflicts with any other variables which possibly use $symbol.

是三者中最安全的版本。它使$局部变量,从而优雅地避免与可能使用$符号的任何其他变量的冲突。

I think it was also added fairly recently, don't remember seeing it before.

我想它也是最近添加的,不记得以前看过它。

These function all do the same things - execute some code when DOM is ready. $(document).ready(function(){})is the original one, and it matches the underlying javascript API.

这些函数都做同样的事情——在 DOM 准备好时执行一些代码。$(document).ready(function(){})是原始的,它匹配底层的 javascript API。

"$" and "jQuery" which accept function as an arguments were created as shortcuts to avoid repeating such a common construct. Accepting a function which accepts $ as its first argument is a further syntax sugar - now you get convenience of the closures without the need to do it yourself.

接受函数作为参数的“$”和“jQuery”被创建为快捷方式,以避免重复这种常见的构造。接受一个接受 $ 作为其第一个参数的函数是一种进一步的语法糖 - 现在您可以方便地使用闭包,而无需自己动手。

回答by ThiefMaster

  • $(function())is a syntax error.
  • $()creates an empty jQuery object.
  • $(document).ready(function() { ... })executes the given function when the DOM is ready
  • $(function() { ... })is a shortcut for the same thing
  • jQuery(function($) { ... })does so, too, but it also makes $available inside the function no matter what it's set to outside.
  • $(function())是语法错误。
  • $()创建一个空的 jQuery 对象。
  • $(document).ready(function() { ... })当 DOM 准备好时执行给定的函数
  • $(function() { ... })是同一件事的捷径
  • jQuery(function($) { ... })也这样做,但它也$可以在函数内部使用,无论它在外部设置什么。

回答by David Spillett

When you call the main jQuery factory function (either as jQuery(<something>)or the common shortcut $(<something>)) it decides what to do based on the type of <something>.

当您调用主要的 jQuery 工厂函数(作为jQuery(<something>)或常用快捷方式$(<something>))时,它会根据<something>.

If you pass a string as <something>it assumes that is a selector specification and will return a jQuery list of elements matching that selector.

如果您传递一个字符串,因为<something>它假定这是一个选择器规范,并将返回与该选择器匹配的元素的 jQuery 列表。

If you pass a jQuery object (representing a list of elements, i.e. an object returned from a previous call to jQuery) it will just return that object (essentially this is a non-operation).

如果您传递一个 jQuery 对象(代表一个元素列表,即从前一次调用 jQuery 返回的对象),它只会返回该对象(本质上这是一个非操作)。

If you pass it a DOM element it will return a jQuery list containing just that element (so you can apply jQuery methods to that element). This is what is happening with $(document).ready()- you pass the factory function the DOM element "document", it returns a jQuery object representing that element, and you use that object's ready() method to add an event handling function to the ready event of all the DOM elements in the list (just the one, document, in this case).

如果你向它传递一个 DOM 元素,它将返回一个只包含该元素的 jQuery 列表(因此你可以将 jQuery 方法应用于该元素)。这就是正在发生的事情$(document).ready()- 您将 DOM 元素“文档”传递给工厂函数,它返回一个表示该元素的 jQuery 对象,然后您使用该对象的 ready() 方法将事件处理函数添加到所有列表中的 DOM 元素(document在本例中仅为 , )。

If you pass it a function, this is just a shorthand for "run this when everything is ready for you to do so", so $(function() { ... });is equivalent to $(document).ready(function() { ... });

如果你向它传递一个函数,这只是“在一切准备就绪时运行它”的简写,所以$(function() { ... });相当于$(document).ready(function() { ... });

回答by Seth

So I was corrected on this and if you read the first comment it gives some context.

所以我对此进行了纠正,如果您阅读第一条评论,它会提供一些背景信息。

jQuery(function() {
    // Document Ready
});


(function($) {
    // Now with more closure!
})(jQuery);

I'm not 100% sure but I think this just passes the jQuery object into the closure. I'll do some digging on the google to see if I am right or wrong and will update accordingly.

我不是 100% 确定,但我认为这只是将 jQuery 对象传递到闭包中。我会在谷歌上做一些挖掘,看看我是对还是错,并会相应地更新。

EDIT:

编辑:

I'm pretty much right, but here it is straight from their website:

我几乎是对的,但这里是直接来自他们的网站:

http://docs.jquery.com/Plugins/Authoring

http://docs.jquery.com/Plugins/Authoring

"Where's my awesome dollar sign that I know and love? It's still there, however to make sure that your plugin doesn't collide with other libraries that might use the dollar sign, it's a best practice to pass jQuery to a self executing function (closure) that maps it to the dollar sign so it can't be overwritten by another library in the scope of its execution."

“我知道并喜欢的令人敬畏的美元符号在哪里?它仍然存在,但是为了确保您的插件不会与可能使用美元符号的其他库发生冲突,最佳实践是将 jQuery 传递给自执行函数(关闭)将它映射到美元符号,这样它就不会被执行范围内的另一个库覆盖。”

回答by Mutt

First off, jQuery()is not the same as $(document).ready()

首先,jQuery()不一样$(document).ready()

$()is a shortcut for jQuery()

$()是捷径 jQuery()

and...

和...

$(function(){ ...});is a shortcut for $(document).ready(function(){ ... });

$(function(){ ...});是捷径 $(document).ready(function(){ ... });

Thus:

因此:

jQuery(function(){ ... }) 

Will function the same as

功能与

$(document).ready(function({ ... });

But...

但...

jQuery('#foo').css("background-color", "#f00");

would not function the same as

不会像

$(document).ready('#foo').css("background-color", "#f00");

So...

所以...

jQuery()is notthe same as $(document).ready()

jQuery()一样的$(document).ready()