spring boot js外部ファイル呼び出し方

Question

http://urx.red/2XVx
上記の部分を学習しているのですが、htmlからjsを呼び出すと上記のような形で、動くのですがjsを外部ファイルで記述し下記のように呼び出した場合にjsの処理が動かない形になります。

外部js記述
function action(){
var val = document.getElementById("text1").value;
var res = parseInt(val * ((100 + /[[${tax}]]/) / 100));

document.getElementById("msg").innerHTML = 
	"inclued tax: " + res ;

}

var res = parseInt(val * ((100 + /[[${tax}]]/) / 100));
の箇所の「/[[${tax}]]/」がjsファイルでは「/* */」がコメントアウトされているのかと思って、
思う動作ができていないと推測しています。

外部ファイル（js）で、「http://urx.red/2XVx」の動作したい場合の外部ファイル（js）の記述方法を
頂けますと幸いです。

宜しくお願い致します。

Comments

[m.ts10806]

コードはマークダウンの機能を利用してご提示ください。

※回答はしますが、マークダウンの対応だけはしておいてください。

Answer 1

上記にて、完了しました。

Comments

[m.ts10806]

上記？
私の回答のことなのであれば自己解決にするのはいかがなものかと。

Answer 2

.jsではJavaからThymeleafに渡された変数を直接参照することはできません。
ブラウザから実際に.jsを確認してみると良いです。
おそらく /*[[${tax}]]*/という文字列がそのままきているはずです。
コメントアウトも当然ですが、そもそも変数が来ていないわけですね。
.jsファイルなのでThymeleafの機能が及ばない領域ということです。
強いてなら、Thymeleaf側で一度受け取るように書くと良いかもしれませんが、

※未検証

<script>
let tax =  /*[[${tax}]]*/;
</script>
<script src="action.js"></script>

//action.js
//~~~省略
var res = parseInt(val * ((100 +  tax) / 100));
//~~~省略

あまり良い手段ではないと思います。
Ajax介して情報取得した方が良いかと思います。

※あくまで外部jsプログラム自体が正しく読み込めている前提
※読み込めていない場合はブラウザ開発ツールのコンソールにエラーが出ているはず

Comments

[oruka1982]

ご回答ありがとうございます。
jsでThymeleafを参照することは難しいですよね。

別の手段として、jsの中でURlを取得して動くようにはなったのですが、ちょっと気になって投稿させて頂きました。

ありがとうございます。