jQuery Library: What It Is, How to Use It (with Example)

This code snippet links the jQuery library to a web page using an external source. The provided URL points to the jQuery library file hosted on Google servers. The 'src' attribute specifies the location of the external file.

jQuery is a compact, versatile JavaScript library renowned for its efficiency in navigating HTML documents, handling events, and creating animations. Its popularity among web developers stems from its ability to streamline the creation of interactive and dynamic web pages. jQuery empowers developers to manipulate HTML elements, style them using CSS, craft animations, manage events, and execute AJAX requests with ease.

Example of Using the jQuery Library:

Imagine a webpage containing a button element with the ID 'myButton'. You want to trigger an alert message when this button is clicked. Here's how to achieve this using jQuery:

HTML Code:

<button id='myButton'>Click me</button>

jQuery Code:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
<script>
  $(document).ready(function(){
    $('#myButton').click(function(){
      alert('Button clicked!');
    });
  });
</script>

In the provided code, we first include the jQuery library using the script tag and the 'src' attribute. Next, the jQuery function '$' is used to target the button element with the ID 'myButton'. We then attach a click event to this button using the 'click' method. Within the event handler function, an alert message is displayed using the 'alert' function.

When the user clicks the button, the alert message 'Button clicked!' will be displayed.