JavaScriptファイルを読み込む際にキャッシュを回避する方法

ページ印刷(本文のみ)

JavaScriptファイルを読み込む際にキャッシュを回避する方法について紹介します。キャッシュを回避することで、常に最新のJavaScriptコードを取得し、問題の修正や機能の追加が反映されるようになります。

以下のコードを使用して、タイムスタンプを取得し、JavaScriptファイルのURLにタイムスタンプを付加しています。

<script src="https://code.jquery.com/jquery-latest.min.js"></script> 
<script>
    
		// 現在のタイムスタンプを取得
		const timestamp = Math.floor(Date.now() / 1000);

		// JavaScriptファイルのURL
		const scriptUrl = "/wp-content/themes/ystandard-child/js/sample.js";

		// タイムスタンプをURLに追加
		const scriptUrlWithTimestamp = scriptUrl + "?v=" + timestamp;

		// スクリプト要素を作成してドキュメントに追加
		$("<script>")
		  .attr("src", scriptUrlWithTimestamp)
		  .appendTo("body");
    
    </script>

このコードでは、Date.now()を使用して現在のタイムスタンプを取得し、JavaScriptファイルのURLにタイムスタンプを付加しています。そして、$("<script>")を使用してスクリプト要素を作成し、.attr("src", scriptUrlWithTimestamp)でsrc属性を設定し、.appendTo("body")<body>要素に追加しています。

これにより、JavaScriptファイルが常に最新のバージョンで読み込まれるようになります。キャッシュを回避することで、閲覧者に最新の機能や修正内容を提供できます。