jQuery Syntax

0 1291

We can perform a specific task on a particular HTML element by using jQuery.
Through the use of selectors, which concisely represent elements based upon their attributes or position within the HTML document, we can perform several actions.

Related Topics:

jQuery History

Installing jQuery

jQuery Syntax

$(selector).action();

jquery(selector).action();

Explanation:

The $() function ( jQuery() function) returns a special JavaScript object containing an array of the DOM elements that match the selector. This object possesses a large number of useful predefined methods that can act on the group of elements.
(selector) is used to find or query HTML elements. jQuery supports most of the selectors like class or ID.
action() represents a jQuery action to be performed on the HTML elements.

The document ready handler:

jQuery provides a simple way to trigger the execution of code once the HTML DOM tree has loaded means the jQuery code runs after the document is finished loading or ready.

Syntax:

$(document).ready(function(){

  // jQuery code

});

We can also use the below shorter syntax:

$(function(){

  // jQuery code write here...

});

Example:

In this example, we create a new HTML element by using a ready handler.

<html>
 <head>
 <title> jQuery Example </title>
 <script type = "text/javascript"
        src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">
      </script>
 <script type="text/javascript">
 $(function(){
 $("<p>Hi there!</p>").insertAfter("#followMe");
 });
 </script>
 </head>
 <body>
 <p id="followMe">Welcome to CodingTag!</p>
 </body>
</html>

Output: