ユーザー ブラウザで 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>
出力:
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>
出力:
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