Please explain this JS syntax: $()



  •  I don't know much JS and I saw this syntax used and don't quite know what it means:



    $(":button[name=select_all]").click(function(){
    $(":checkbox").attr( 'checked','checked' );
    });

     I know that the intended purpose of this snippet was to make a "select all" button that would check all of the checkboxes in a form. But it doesn't work as intended and I'd like to fix it.

     Can somebody explain what the $() operator does? I guess it takes an Xpath and returns an array of DOM nodes?

     Thanks...





  • I've just hacked apart an obfuscated javascript that used $ as a variable name. I suppose it could be used as a function name too. It's not good practice in either cases though.



  • @Faxmachinen said:

    I've just hacked apart an obfuscated javascript that used $ as a variable name. I suppose it could be used as a function name too. It's not good practice in either cases though.

    In Javascript, functions are variables.  In Prototype, the $ function can be passed a string or a DOM element.  In the former case it returns the DOM element with the corresponding ID, with the latter it returns the DOM element itself.  It's useful shorthand for document.getElementById but it's also good for a type of "generic" programming where code can deal with DOM elements or IDs without having to do the checks itself.  In jquery the $ function is used to do many things, but the most common is returning DOM elements based on CSS selectors.  That is what the OP's code is doing.  I'm not fond of the $ function myself but it is quite common in the world of Javascript frameworks.



  • JS is a little strange at that, but unlike in other languages, identifiers can contain "$" as a normal character, in addition to the usual numbers, letters and "_". So $$$, $foo$ and $123 are valid identifiers and $() is just a normal function call to the "$" function.(Or to the property "$", containing a function, so morbius doesn't hit me)

    I think it's historical, because earlier versions of JS used properties named "$0" to "$9" in their regex API. (They were, apparently, far too cool for arrays)



  •  http://www.prototypejs.org/api/utility/dollar

    There's a good chance that this library is being used. (It's included by scripts such as scriptaculous, so you may not see it included directly.)



  • @PSWorx said:

    ...and $() is just a normal function call to the "$" function.

    Raises his meaty fist in rage

    @PSWorx said:

    (Or to the property "$", containing a function, so morbius doesn't hit me)

    Dammit!  Alright, fine, have it your way.  You better get your ass back in the kitchen and make me a sammitch, though!



  • @Nandurius said:

     http://www.prototypejs.org/api/utility/dollar

    There's a good chance that this library is being used. (It's included by scripts such as scriptaculous, so you may not see it included directly.)

    Read my post above.  It is jQuery because it is using CSS selectors to pull out elements.



  • That stuff Mr Wilters said.



  • @morbiuswilters said:

    @Nandurius said:

     http://www.prototypejs.org/api/utility/dollar

    There's a good chance that this library is being used. (It's included by scripts such as scriptaculous, so you may not see it included directly.)

    Read my post above.  It is jQuery because it is using CSS selectors to pull out elements.

     

     

    Thanks all... More complicated than I had thought (I assumed it was a built-in because I didn't know $ was a valid function name) but at least now I know what I don't know.



  •  If that was new for you, then here is some good advice. Learn to use prototype and/or Jquery, they will save you a lot of headache. But also learn how to do stuff in normal JS, because sometimes there is a trade-off between speed and ease of use.

    Also read up on closures in JS, if you don't know about it, they will bite you in the head.

    and Thirdly. Make it good practice to write your JS outside of the global scope.

    You should treat JS like any other programming language.
    So use best practice and write reusable, maintainable code and you will find JS to be a lot less of a frustration.


Log in to reply
 

Looks like your connection to What the Daily WTF? was lost, please wait while we try to reconnect.