difference between $ and $$ - javascript

I used $ instead of document.getElementById() in javascript and i don't know what is the use of $$. Can any one please tell me what is the use of $$?
Here is the code:
var link_object = $$('a[class="menu_item"]');
if (window.location.href.search('inident.do') >= 0) {
link_object.each(function (elem) {
if (elem.innerHTML == 'Create an Incident') {
elem.style.fontWeight = 'bold';
elem.style.color = 'black';
}
});
}

The single $ is usually a short name for jQuery object.
The double $$ could be anything.
In Angular, seems to designate a private identifier.
You can do something like this when you hate your colleagues :
$$$$($$$[$]);

$ is the selector in jquery. $$ doesn't have any specific meaning in jquery
so you can use it in your own way.
like this
function $$(){
alert('hello');
}
$$();
There may be other libraries like jquery which use $ or may be use $$.
since $ is valid symbol in javascript for variable and function names
it is the best way to simplify the dom selection instead of using long
document.getElementById() like functions.
contribution of Mr. Robg
In jQuery, $ is a function that takes different types arguments. It will accept functions, arrays, objects (native and host), strings or nothing at all. If it gets a string, it will work with a selector or HTML

$$ doesn't have any particular meaning for jQuery. But if you are using some library who can conflict with jQuery, you can change the name of $ function to anything you want by using jQuery noConflict function;
You should look for something like this early in your code
var $$ = jQuery.noConflict();

Are you sure this is jQuery ? It looks like mootools.
In mootools, $$() is the element selector function. It works similar to $() in jQuery.
$('id')
returns the element with id 'id'.
$$('selector')
returns a collection of the elements corresponding to the selector passed.

Related

jQuery's dollar syntax vs dollar sign JavaScript "convention"

I've read here that for JavaScript there's a "convention" that the $ function be defined as a shortcut for document.getElementById, so I've defined the following function in a <script>,
function $(x) { return document.getElementById(x); }
so I could write $('main') instead of document.getElementById('main'), for instance.
Soon after, when I started looking into jQuery, I found that jQuery uses the syntax $(selector).action() extensively.
However, the two solutions don't seem to work nicely together.
Are indeed the two mutually exclusive? As in, if I use jQuery, I can't use the $ function above, and if I use the latter I can't use jQuery?
You can use jQuery.noConflict to return control of $. Then, to use jQuery, use jQuery instead of $.
jQuery.noConflict();
jQuery('#main')
You can also assign the returned value of noConflict to an object, and use it just like $:
var a = jQuery.noConflict();
a('#main')

How to use jQuery's trim() function

As discussed in many questions on stack - IE 8 wont accept .trim(), but the jQuery framework takes care of that.
I don't know how to translate my function to use that version of trim (I thought I was already using jQuery), could someone advise? Here is my code:
$('input').val(function(index, val){
return val.replace('Please Select', '').trim();
});
This is designed to replace the string with nothing.
I've tried:
$('input').val(function(index, val){
return val.replace('Please Select', '')$.trim();
});
but that was no good.
$.trim(val.replace('Please Select', ''))
http://api.jquery.com/jQuery.trim/
IE8 doesn't have a native trim method, generally, I just augment the prototype:
if (!String.prototype.trim)
{
String.prototype.trim = function()
{
return this.replace(/^\s+|\s+$/g,'');
};
}
This is the shortest regex to trim a string, but I have heard it say that .replace(/^\s\s*/,'').replace(/\s*\s$/,'') is (marginally) faster... the choice is yours
If you really want to use jQuery for this, of course, you'll have to make the target string the context of the called method ($.trim calls the method on $ === the jQuery object), so make the String a jQ object:
$(' foo bar ').trim();//returns "foo bar"
//compared to augmented prototype:
' foo bar '.trim();//returns "foo bar"
The benefit of an augmented prototype is that you don't have the additional overhead of creating a new jQuery object, whereas using the prototype-approach relies on JS to wrap the string in a native String object and apply the method to that. Basically, it's the same operation, but it should be a marginally more efficient, because jQuery does a bunch of checks to any string passed to the jQuery constructor ($())
Try this:
$.trim(val.replace('Please Select', ''));
Here's the Trim() entry in the documentation.

Operating on a string rather than a selector from a jQuery Plugin

I want to create a plugin that works like so:
var fmatted = $('someString').myFunction();
I've developed jQuery functions in the following manner:
$(someSelector).someFunction();
I know that the selector gets converted to a jQuery object and can be used via this in the plugin. However, if I want to use a string rather than a selector, I'm not sure how I can access that string within my plugin.
Basically, I want to be able to use a plugin to operate on something other than a selector, very much like jQuery's .trim() function, but I can't figure out how to access that within the plugin.
jQuery(selector)[docs] (or $(selector)) is used to create a jQuery object containing elements that match the selector. Although it is possible for you to create a method which ignores the elements and retrieve the original selector, this is not efficient and makes it more difficult to understand what your code is doing.
jQuery.trim()[docs] is not implemented like that. In fact, notice that jQuery.trim() isn't a method on a jQuery object at all! If it were, you'd invoke it like this:
jQuery(" foo ").trim();
Instead, you do this:
jQuery.trim(" fooo ");
.trim() is a method, but not a method of jQuery objects. It's a method of the jQuery constructor function itself (in some languages you would call this a "class method").
You're not creating an object and the argument is never treated as a selector. To add a function like this yourself, all you need to do is this:
jQuery.someFunction = function(message) { alert(message); };
More idiomatically, the default behaviour of the jQuery.extend[docs] will do this for you:
jQuery.extend({someFunction: function(s) { alert(s); } })
That's all you need!
use the selector property:
var jQueryObject = $('my string');
var originalString = jQueryObject.selector;// it'll give you 'my string'
Is this what you're after?
$.fn.makeLower = function() { return this.selector.toLowerCase(); }
$("FOO").makeLower(); // produces "foo"

What does JS $ mean?

I don't grok the idea/purpose/use of Javascript $, as in
function $(id) {
return document.getElementById(id);
}
Could someone please explain or point me at an explanation?
Thanks!
-- Pete
When you see JavaScript code that involves lots of $(foo) function calls, it's probably using either the jQuery or the Prototype web development frameworks. It's just an identifier; unlike a lot of other languages, identifiers (function and variable names) can include and start with "$".
In your code it is the name of a function.
function $(id) { return document.getElementById(id); }
$("my_id")
function myfunc(id) { return document.getElementById(id); }
myfunc("my_id")
Two functions, two different identifiers.
Most commonly this is used by JQuery - specifically, JQuery creates an object with a reference of $ which has various methods to simplify page manipulation.
It's technically possible for anything to attach a class to $
It's just the name of a function called $(). The dollar sign ($) is a valid character for identifiers in JavaScript. jQuery, for example, uses it as a shorthand alias for the jQuery() function.
There are two main reasons to use $ as a function name, especially in frameworks like jQuery:
It's short but distinctive - you're going to use it all over the place, so you don't want it to take up too much space.
When used as a DOM element selector, the function and its parameters together kind of look like a Perl/PHP/Java properties variable - and it kind of works like that as well, since the main purpose is to do something with the selected DOM elements.

What is the meaning of "$" sign in JavaScript

In the following JavaScript code there is a dollar ($) sign. What does it mean?
$(window).bind('load', function() {
$('img.protect').protectImage();
});
Your snippet of code looks like it's referencing methods from one of the popular JavaScript libraries (jQuery, ProtoType, mooTools, and so on).
There's nothing mysterious about the use of $ in JavaScript. $ is simply a valid JavaScript identifier. JavaScript allows upper- and lower-case letters (in a wide variety of scripts, not just English), numbers (but not at the first character), $, _, and others.¹
Prototype, jQuery, and most javascript libraries use the $ as the primary base object (or function). Most of them also have a way to relinquish the $ so that it can be used with another library that uses it. In that case you use jQuery instead of $. In fact, $ is just a shortcut for jQuery.
¹ For the first character of an identifier, JavaScript allows "...any Unicode code point with the Unicode property “ID_Start”..." plus $ and _; details in the specification. For subsequent characters in an identifier, it allows anything with ID_Continue (which includes _) and $ (and a couple of control characters for historical compatibility).
From another answer:
A little history
Remember, there is nothing inherently special about $. It is a variable name just like any other. In earlier days, people used to write code using document.getElementById. Because JavaScript is case-sensitive, it was normal to make a mistake while writing document.getElementById. Should I capital 'b' of 'by'? Should I capital 'i' of Id? You get the drift. Because functions are first-class citizens in JavaScript, you can always do this:
var $ = document.getElementById; //freedom from document.getElementById!
When Prototype library arrived, they named their function, which gets the DOM elements, as '$'. Almost all the JavaScript libraries copied this idea. Prototype also introduced a $$ function to select elements using CSS selector.
jQuery also adapted $ function but expanded to make it accept all kinds of 'selectors' to get the elements you want. Now, if you are already using Prototype in your project and wanted to include jQuery, you will be in problem as '$' could either refer to Prototype's implementation OR jQuery's implementation. That's why jQuery has the option of noConflict so that you can include jQuery in your project which uses Prototype and slowly migrate your code. I think this was a brilliant move on John's part! :)
That is most likely jQuery code (more precisely, JavaScript using the jQuery library).
The $ represents the jQuery Function, and is actually a shorthand alias for jQuery. (Unlike in most languages, the $ symbol is not reserved, and may be used as a variable name.) It is typically used as a selector (i.e. a function that returns a set of elements found in the DOM).
As all the other answers say; it can be almost anything but is usually "JQuery".
However, in ES6 it is a string interpolation operator in a template "literal" eg.
var s = "new" ; // you can put whatever you think appropriate here.
var s2 = `There are so many ${s} ideas these days !!` ; //back-ticks not quotes
console.log(s2) ;
result:
There are so many new ideas these days !!
The $() is the shorthand version of jQuery() used in the jQuery Library.
In addition to the above answers, $ has no special meaning in javascript,it is free to be used in object naming. In jQuery, it is simply used as an alias for the jQuery object and jQuery() function.
However, you may encounter situations where you want to use it in conjunction with another JS library that also uses $, which would result a naming conflict. There is a method in JQuery just for this reason, jQuery.noConflict().
Here is a sample from jQuery doc's:
<script src="other_lib.js"></script>
<script src="jquery.js"></script>
<script>
$.noConflict();
// Code that uses other library's $ can follow here.
</script>
Alternatively, you can also use a like this
(function ($) {
// Code in which we know exactly what the meaning of $ is
} (jQuery));
Ref:https://api.jquery.com/jquery.noconflict/
From the jQuery documentation describing the jQuery Core Object:
Many developers prefix a $ to the name of variables that contain jQuery
objects in order to help differentiate. There is nothing magic about
this practice – it just helps some people keep track of what different
variables contain.
Basic syntax is: $(selector).action()
A dollar sign to define jQuery A (selector) to "query (or find)" HTML elements A jQuery action() to be performed on the element(s)

Categories

Resources