質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

4009閲覧

JavascriptかJQueryを使ってCache Bustingする方法

lingwood

総合スコア40

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2018/10/17 05:37

編集2018/10/17 09:51

前提・実現したいこと

JavascriptかJQueryを使い日付やバージョンを自動的に生成して、
CSSやJSにクエリ付加するCache Bustingnigをしたいのですが、
うまくできません。

WordPressサイトではなく、また、phpが使える環境ではないため
その方法を模索しています。
いろいろなサイトを参考にしたのですが、
何度やっても

<link rel="stylesheet" type="text/css" href="/css/style.css?ver=20181017143123"> こんな感じに文章が出現しないため途方に暮れています。

以下、参考にしたコードです。

また、QiitaさんのASP版と言われているものなどはどう使ったら良いのでしょうか?

JavascriptとHTMLがちょっと分かる程度なので、
ズバリで教えていただけるとすごく助かります。

該当のソースコード

<script> var today = new Date() var year = today.getFullYear() var month= today.getMonth() + 1 var date = today.getDate() if (month < 10) { month = "0" + month } if (date < 10) { date = "0" + date } var versioningNum = "" + year + month + date var jsURL = 'js/custom.js?ver=' + versioningNum var jsElement=document.createElement('script') jsElement.setAttribute('src', jsURL) document.getElementsByTagName("body")[0].appendChild(jsElement) </script>
<script> var versioningNum = new Date().getTime() var jsURL = '../../portfolio/js/custom.js?ver=' + versioningNum var jsElement=document.createElement('script') jsElement.setAttribute('src', jsURL) document.getElementsByTagName("body")[0].appendChild(jsElement) </script>

↓↓↓Qiitaさんのサイトから拝借したコード

Function filedate(filename) Dim fso,file,dtm Set fso = CreateObject("Scripting.FileSystemObject") Set file = fso.GetFile(Server.MapPath(filename)) dtm = file.DateLastModified Set fso = Nothing Set file = Nothing 'yyyy/mm/dd hh:mm:ss を yyyymmddhhmmss に変換 filedate = filename & "?date=" & Replace(Replace(Replace(dtm, "/", ""), ":", ""), " ", "") End Function

よろしくお願いします。

追記

テストファイルを作成して動作を確認しています。

<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width; initial-scale=1.0"> <!-- css --> <link rel="stylesheet" type="text/css" href="css/reset.css"> <link rel="stylesheet" type="text/css" href="css/style.css"> <link href="http://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet"> <!-- script --> <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <script type="text/javascript" src="https://code.jquery.com/jquery-migrate-1.4.1.min.js"></script> <script type="text/javascript" src="./js/scroll.js"></script> <script type="text/javascript" src="./js/scrollTgBlank.js"></script> <script type="text/javascript" src="./js/common.js"></script> <script> var versioningNum = new Date().getTime() var jsURL = './js/common.js?ver=' + versioningNum var jsElement=document.createElement('script') jsElement.setAttribute('src', jsURL) document.getElementsByTagName("body")[0].appendChild(jsElement) </script> </head> <body id="top"> <!-- =========================================================== --> <!-- =========================================================== --><div style="margin-bottom:150px;"></div> <!-- =========================================================== --><div style="margin-bottom:250px;"></div> <a href="#top" class="pagetop">PAGETOP</a> </body> </html>

出力がないです。
イメージ

イメージコンソールエラーはありませんでした。](eb4dd3ee5290b3d2b34cfd027a1b1833.png)

### 追記②

失礼いたしました。コンソールエラーはありました。
ソースコードを表示したページのコンソールを確認してしまっていました。
イメージ説明

### 追記③
失礼いたしました。
出ているようでした・・・
x_x様 ありがとうございます!
イメージ説明

### Javascriptを使って他に上手く出力させる方法などはないのでしょうか?
例えばですが、phpのように日付を格納した変数を置くといった方法です。

<link rel="stylesheet" type="text/css" href="css/style.css?v=変数"> <script type="text/javascript" src="./js/common.js?v=変数"></script>

また、もしあればですが何か他に良い方法があったら教えていただけませんでしょうか?

宜しくお願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

x_x

2018/10/17 06:18

スクリプトには問題ないように見えますが、何かエラーになっているのでしょうか? また、最後のはレガシーASPであり、いま使うことはないかと思います。
lingwood

2018/10/17 08:50

x_x 様 ご回答ありがとうございます。お返事が遅れてすみません。エラーではなく、ソースを見ても出力されていないためです。ちなみに、ローカルにHTML1つ作って確認しているのですが、サーバーに上げなくても大丈夫ですよね?それが問題なのでしょうか??
lingwood

2018/10/17 08:52

x_x 様 再々投稿ですみません。レガシーASPとはなんでしょうか?普通のWeb制作ではほぼ使うことはないのでしょうか?いろいろ伺ってすみません。もっとできるようになりたくて、すみませんがお時間ある時で構いませんので教えて下さい。よろしくお願い致します。
x_x

2018/10/17 08:57

20年前のものですから。ASP.NETがあるのでまず使うことはないかと
x_x

2018/10/17 09:00

開発者ツールのコンソールを開いてエラーがないか確認してみてください。ソースを見ても自分が書いたものがあるだけなので、実際に読み込んだスクリプトが動作するかで判定、またはやはり開発者ツールのElements (IEならDOM Explorer) で見てみてください
lingwood

2018/10/17 09:05

ありがとうございます!ただやはりエラーもなく動きもないため、一旦当該部分のコードと状況が分かるようキャプチャをとって貼り付けたいと思います。
x_x

2018/10/17 09:38

Elements も確認してもらえるでしょうか?
lingwood

2018/10/17 09:46

x_x 様 ありがとうございます。Elementsを確認したところ、出力されていました。何度も手間をおかけしてすみません。ソースコード上に出ると思っていたので・・・もう少し簡単にする方法(例えばcssやjsファイルの指定する際に?ver=変数)もしくは、もっと良い方法とかはないのでしょうか?
lingwood

2018/10/17 11:34

x_x  様 ありがとうございました。本当に助かりました。いろいろと試行までしていただき大変感謝いつも大変感謝しております。またの際にも宜しくお願い致します。
guest

回答1

0

ベストアンサー

<script>~</script> を、</body>直前に移動してください。

body出現前にbodyを参照しているためエラーになります。

投稿2018/10/17 09:19

x_x

総合スコア13749

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

x_x

2018/10/17 09:23

とはいえ、手元の環境ではmetaのエラーと「Uncaught TypeError: Cannot read property 'appendChild' of undefined」が出ているのでまったく何も出ない理由はわからないですね
lingwood

2018/10/17 09:36

x_x 様 ありがとうございます。コンソールエラーの件は、ちゃんと出ていたようです。大変失礼いたしました。 Ctrl+Uでソースコードを表示したページをF12で検証したためです。 また/body直前に移動してみたのですが、やはり出力はされていないためどうしたらいいのでしょうか・・・
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問