JavaScriptちゃんと学習中。
ほぼ自分の勉強メモです。
過度な期待はしないでください。
JavaScriptのコード読み込み
- HTMLドキュメントに直接書く方法
HTMLドキュメント内に、<script>、</script>
を追加すれば、その中にJavaScriptを直接書く事が
出来る。
<script>ダグ
は、<head>~</head>
内、または<body>~</body>
内のどこにでも追加出来る。
が、一般的には</body>
終了ダグの直前に追加する。
<body>
・・・省略
<script>
'use strict';
ここにJavaScriptのコードを書く
</script>
</body>
use strict
は、相互性を確保する為のもの
要は、新しいJavaScriptをちゃんと実行させる為のものという認識で良いかと
- JavaScriptファイルを指定して読み込む
<script>
ダグにsrc属性を追加して、そこに外部JavaScriptファイルのパスを指定。
<script src="JavaScriptファイルのパス"></script>
<body>
・・・省略
<script src="script.js"></script>
</body>
'use strict';
ここにJavaScriptのコードを書く
RailsにおけるJavaScriptの読み込み
railsにはAssets Pipelineという、app/assetsの配下に置いたファイルと、
application.js・application.cssを自動的にコンパイルされる仕組みがある。
なので、app/assetsの配下に設置したJavaScriptもすべてのviewで実行される。
- 手順
1、JavaScriptを記述するディレクトリを作成
assetsディレクトリ内に、javascriptsというディレクトリを作成
2、 JavaScriptを記載する準備
先程作成した、app/assets/javascriptsの中に、application.jsを作成
3、記述したJavaScriptを読み込む為の記述
app/views/layouts/application.html.erbの<head>~</head>
内に、
<%= javascript_include_tag 'application' %>
を加える。
4、manifest.jsに記載
app/assets/config/manifest.jsに下記を記載する。
//= link_directory ../javascripts .js
これで作成したapplication.jsのファイルを呼び出せるようになる。
5、application.jsに下記を記述
//= require rails-ujs
//= require_tree .
//= require rails-ujsはRailsでJavaScriptを使用する為のもの。
//= require_tree .は、application.jsが存在するディレクトリの、JavaScriptファイルを
全て読み込む為のもの。
↓↓↓ こういう事です。
application.jsに、//= require_tree .記載すれば、
application.jsの下にある、3つのjsファイルもちゃんと読み込まれる。
これで、ちゃんとJavaScriptが読み込まれていると思うので
console.logで確認してみてください!
過去投稿記事
【JavaScript ~変数・定数、if文・switch文~】勉強メモ
【JavaScript ~for文、配列、オブジェクトについて~】勉強メモ②
【JavaScript ~関数について~】勉強メモ③
【JavaScript ~クラスやインスタンス、メソッドについて~】勉強メモ④
【JavaScript ~ファイルの分割について~】勉強メモ⑤
【JavaScript ~配列のメソッド~】勉強メモ⑦
【JavaScript ~コールバック関数~】勉強メモ⑧
【JavaScript ~HTMLを置き換え、ダイアログボックス~】勉強メモ⑨
【JavaScript ~イベント~】勉強メモ⑩
【JavaScript ~イベント(入力内容を取得)とDateオブジェクト~】勉強メモ11
【JavaScript ~Mathオブジェクト~】勉強メモ12