ユーザー ブラウザで jQuery のバージョンを確認する

Habdul Hazeez 2024年2月15日
  1. typeof 演算子を使用して jQuery のバージョンを取得する
  2. window オブジェクトを使用して jQuery のバージョンを取得する
ユーザー ブラウザで jQuery のバージョンを確認する

この記事では、Web ページで jQuery バージョンを取得する 2つの方法を説明します。 最初のメソッドは Web ページが jQuery をロードしているかどうかをチェックし、2 番目のメソッドは jQuery が window オブジェクトに存在するかどうかをチェックします。

typeof 演算子を使用して jQuery のバージョンを取得する

Web ページが jQuery ライブラリをロードすると、jQuery キーワードまたはドル記号 ($) によって利用可能になります。 これにより、typeof 演算子を使用して $ または jQuery が存在するかどうかを確認できます。

チェックがtrueを返した場合、jQuery は Web ブラウザーに存在するため、バージョン番号を出力できます。

それが、次のコードで実行したことです。 以下は、Web ブラウザーでの出力です。

<!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>

出力:

typeof 演算子 - Firefox 104.0.2 の jQuery バージョン

window オブジェクトを使用して jQuery のバージョンを取得する

Web ブラウザーが jQuery ライブラリーをロードした場合、そのエイリアスが window オブジェクトで使用可能になります。 この知識があれば、window オブジェクトで jQuery をチェックして、バージョン番号を取得できます。

前の例とは異なり、jQuery().jquery を使用してバージョンを取得します。 これはオブジェクトを作成するので、それを望まない場合は、最初の例を使用してください。

以下では、バージョンを出力する前に window オブジェクトに jQuery が含まれているかどうかを確認します。

<!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>

出力:

window オブジェクト - Firefox 104.0.2 の jQuery バージョン

著者: Habdul Hazeez
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