what does “return this.each()” do in jQuery?

回眸只為那壹抹淺笑 提交于 2019-12-04 10:43:24

问题


I'm looking at a jQuery plugin, which has a single function. After setting up the appropriate defaults though a constructor argument the function defines a couple of helper functions, and then as the last part returns a call to this.each(), like so:

return this.each(function() {
 //long method defined here
});

I understand the use of this.each() in modifying matching DOM elements and such, but what does the return statement accomplish? Some sort of array of modified DOM elements, which can then be chained in other calls?

I've read about this.each on this site but I can't quite figure what the return does here. Thanks for helping clear this up.


回答1:


It allows for one to call a plugin or an event on a bunch of elements and then apply that same function or event to all of them

So if you do:

$('.selector').myPlugin();

And if, let us say, .selector contains 10 elements, all 10 elements would get whatever myPlugin does.


The reason for returning that .each statement is because .each() returns whatever it was given and it allows you to chain multiple functions and plugins together on one jQuery element.

For example:

$('.selector').myPlugin().yourPlugin();



回答2:


.each returns the elements it was called on, so in this case, it is probably to maintain the ability of methods to be chained on that selector. That means that if the plugin'S method is called foo, you should be able to do

$("mySelector").foo().show();

Because foo returned the result of .each which is basically $("mySelector").

Hope that made sense.




回答3:


It makes functions chainable

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




回答4:


this make it possible to keep objects chain, so you can call jquery methods like this:

$("selector").css().mouseover().etc().blahblah();



回答5:


It returns the JQuery object which method is called on as stated in the docs. So you can call another method on the returned value.

// without method chaining
myobject.a()
myobject.b()
myobject.c()

// with method chaining
myobject.a().b().c();

See method chaining and fluent interface



来源:https://stackoverflow.com/questions/7351620/what-does-return-this-each-do-in-jquery

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!