How to Check jQuery Version in a User Browser

Habdul Hazeez Feb 02, 2024
  1. Get jQuery Version Using the typeof Operator
  2. Get jQuery Version Using the window Object
How to Check jQuery Version in a User Browser

This article teaches two methods to get a jQuery version on a web page. The first method checks the version if the web page has loaded jQuery, while the second method checks the version if jQuery exists in the window object.

Get jQuery Version Using the typeof Operator

When a web page loads the jQuery library, it becomes available via the jQuery keyword or the dollar ( $) sign. With this, you can check if $ or jQuery exists using the typeof operator.

If the check returns true, jQuery exists in the web browser, so you can print the version number.

That’s what we’ve done in the following code. What follows is the output in a web browser.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>01-get-jQuery-version</title>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</head>
<body>
    <script>
        // Check if jQuery exists using the typeof
        // operator. The code in the if block will
        // run ONLY if jQuery exists in the user's
        // web browser
        if (typeof jQuery !== undefined) {
            // Show the jQuery version number in the
            // alert dialog box.
            alert("The current jQuery version is: " + jQuery.fn.jquery);
        }
    </script>
</body>
</html>

Output:

typeof Operator - jQuery version in Firefox 104.0.2

Get jQuery Version Using the window Object

If a web browser has loaded the jQuery library, its alias becomes available in the window object. With this knowledge, you can check jQuery in the window object and get the version number.

Unlike our previous example, we’ll get the version using jQuery().jquery. Mind you, this will create an object, so if you don’t want that, use our first example.

In the following, we check if the window object contains jQuery before we print the version.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>02-get-jQuery-version</title>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <style>
         body {
            background-color: #1a1a1a;
         }
     </style>
</head>
<body>
    <script>
        // Check if jQuery exists in the window
        // object.
        if (window.jQuery) {
            // Show the jQuery version number in the
            // alert dialog box.
            alert("The current jQuery version is: " + jQuery().jquery);
        }
    </script>
</body>
</html>

Output:

window Object - jQuery version in Firefox 104.0.2

Habdul Hazeez avatar Habdul Hazeez avatar

Habdul Hazeez is a technical writer with amazing research skills. He can connect the dots, and make sense of data that are scattered across different media.

LinkedIn