【超簡単】開発者ツールでjQueryのバージョンを確認する方法
jQueryオブジェクトを検査してバージョンを取得する方法
前提条件
以下の環境が必要です。
- ブラウザ
- jQueryライブラリ
手順
- ブラウザの開発者ツールを開きます。
- 開発者ツールの要素タブに移動します。
- jQueryオブジェクトを選択します。
- オブジェクトのプロパティを確認します。
詳細
jQueryオブジェクトのプロパティには、jqueryという名前のプロパティがあります。このプロパティには、jQueryのバージョン情報が格納されています。
例
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
// jQueryオブジェクトを取得
const $obj = $('div');
// 開発者ツールを開く
// ...
// 要素タブに移動
// ...
// jQueryオブジェクトを選択
// ...
// オブジェクトのプロパティを確認
console.log($obj.jquery); // "3.6.0"
});
</script>
jQueryのバージョンを取得するには、以下の方法も利用できます。
$.fn.jqueryプロパティを使用するjQuery.versionプロパティを使用する<script>タグのsrc属性を確認する
詳細は、jQueryの公式ドキュメントを参照してください。
jQueryオブジェクトを検査してバージョンを取得する方法について解説しました。開発者ツールを使用して、jQueryオブジェクトのプロパティを確認することで、簡単にバージョン情報を確認できます。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQueryバージョン取得</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
// jQueryオブジェクトを取得
const $obj = $('div');
// 開発者ツールを開く
// ...
// 要素タブに移動
// ...
// jQueryオブジェクトを選択
// ...
// オブジェクトのプロパティを確認
console.log($obj.jquery); // "3.6.0"
});
</script>
</body>
</html>
実行方法
- 上記のコードをHTMLファイルに保存します。
div要素を選択します。- コンソールを確認します。
コンソールには、jQueryのバージョン情報が表示されます。
上記のコードは、jQueryオブジェクトの jquery プロパティを使用してバージョンを取得しています。
他にも、以下の方法でバージョンを取得できます。
console.log($.fn.jquery); // "3.6.0"
console.log(jQuery.version); // "3.6.0"
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
上記の場合、src 属性の値からバージョン情報を確認できます。
https://code.jquery.com/jquery-3.6.0.min.js
jQueryオブジェクトを検査してバージョンを取得する方法について解説しました。サンプルコードを参考に、バージョン情報を取得してみてください。
jQueryのバージョンを取得するその他の方法
$.fn.jquery プロパティを使用する
console.log($.fn.jquery); // "3.6.0"
jQuery.version プロパティは、jQueryライブラリのバージョン情報を取得するために使用できます。
console.log(jQuery.version); // "3.6.0"
<script> タグの src 属性を確認する
jQueryライブラリの <script> タグの src 属性からバージョン情報を確認できます。
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
https://code.jquery.com/jquery-3.6.0.min.js
jQueryプラグインを使用する
jQueryのバージョンを取得するために使用できるプラグインもいくつかあります。
これらのプラグインを使用すると、より簡単にバージョン情報を取得できます。
例：jQuery Versionプラグイン
$(document).ready(function() {
// jQuery Versionプラグインを使用
console.log($.version); // "3.6.0"
});
jQueryのバージョンを取得するにはいくつかの方法があります。上記の方法を参考に、自分に合った方法を選択してください。
補足
- 上記の方法でバージョン情報を取得できない場合は、以下の原因が考えられます。
- jQueryライブラリが読み込まれていない
これらの場合は、原因を解決してからバージョン情報を取得してください。
javascript jquery
