jQuery Syntax
In this tutorials, we will learn about jQuery syntax , Document Ready Event and function().
jQuery Syntax
With the help of jQuery syntax you can select Html elements and perform actions on them.
Syntax
The below is define the juery syntax.
$(selector).action()
- $ : This sign define jQuery
- (selector) : It select or find Html elements
- action() : It performed action on the html elements
Examples
$(this).hide() - hides the current element.
$("p").hide() - hides all elements.
$(".active").hide() - hides all elements with class="active".
$("#activeid").hide() - hides the element with id="activeid".
Document Ready Event
jQuery methods are written inside a document ready event. This event prevent any jQuery code from running before the document is finished loading, It means jquery code load after complete loading of web page.
Why need Document Ready Event
Document Ready Event prevent any jQuery code from running before the document is finished loading. Suppose if your jquery code load before loading the image in this case you can't get the size of images.
There are following condition action are failed when jQuery method run before the document is fully loaded.
- When you try to get size of any image which is not loaded yet.
- When you try to hide element which is not loaded yet.
Let's consider the following example code which demonstrates the most basic statement of the jQuery Document Ready Event.
<script>
$(document).ready(function(){
alert("Tutorialstrend.com!");
});
</script>This statement is typically known as ready event. Where the handler is basically a function that is passed to the ready() method to be executed safely as soon as the document is ready to be manipulated i.e. when the DOM hierarchy has been fully constructed.
Function()
The jQuery ready() method you can also be written in a shorthand notation like this.
<script>
$(function(){
alert("Tutorialstrend.com!!");
});
</script>You can use any syntax you like as both the syntax are equivalent. Only the difference of name. However, the document ready event is easier to understand when reading the code.
That's quite useful where you have to run jQuery in compatibility mode with other libraries, for example:
jQuery(function
($) {
// use $ here
});The $ argument inside the callback will refer to the jQuery object, outside that function it might refer to another library like PrototypeJS.
Prev Next