Clever Geek Handbook

What is the difference between $ ("selection") and $ ("selection", $ (this))

I saw the use of $ (this) and understood inside a function, but also saw it in a selector, but did not understand when and when it is valuable. Here are two examples I can use and work, but am I really doing something valuable ...

Here I have added $ (this) in selectors

(function($) {
    $(".deliver").on('mouseenter',function(){
        $(this).css({'width':'600px'});
        $(".form_jquery",$(this)).fadeIn(1000).css({'display':'block'});
        $(".componentheading",$(this)).css({'display':'none'});
    }); ...

Here is my original script

(function($) {
    $(".deliver").on('mouseenter',function(){
        $(this).css({'width':'600px'});
        $(".form_jquery").fadeIn(1000).css({'display':'block'});
        $(".componentheading").css({'display':'none'});
    });

I have kept what I know to be the standard use (this) in both cases, and note that I use an anonymous function in case this is the case.

+3


source to share


3 answers 


$(".componentheading",$(this))

only searches for the elements .componentheading

under the current element $(this)

(in this particular case, it is the a .deliver

you entered with the mouse), whereas

$(".componentheading")


searches the entire document.

http://api.jquery.com/jQuery/#jQuery1

+5


source


Providing a second argument to a jQuery function narrows the selection context. By default, the context is the entire document.

When used $(this)

as a context, you are only looking for elements with classes form_jquery

or componentheading

within the element that triggers the handler mouseenter

.



Providing context to narrow down your selector search is a good way to improve selector performance if you know the element you are looking for can actually be found in that context.

0


source 


$( selector, context )

The actual function for jQuery looks like jQuery( selector, context )

if you provide an element for a context value, when jQuery tries jQuery.find

your element it will start from your element.

In many cases, this can provide a performance boost!

Read about jQuery Context

To expose an element to a jQuery function, many people use the DOM caching technique , where you store the element in a variable and pass it to the jQuery function as a reference context.

0


source






More articles:


All Articles