1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

HTMLにJavaScriptを埋め込む(メモ)

Last updated at Posted at 2017-12-02

#HTMLにJavaScriptを埋め込む方法
1.外部スクリプト - HTMLファイルとは別にJavaScriptファイルを作って、<script>タグのsrc属性にパスを書く
2.インラインスクリプト - HTMLファイルの<script>タグの中に書く
3.イベントハンドラ - タグの中にイベントを書く

##1.外部スクリプト - HTMLファイルとは別にJavaScriptファイルを作って、<script>タグのsrc属性にパスを書く
・コードとロジックを分離できるので、管理が楽、再利用もしやすい
・JavaScriptファイルがキャッシュされるので、パフォーマンス向上に繋がる

##2.インラインスクリプト - HTMLファイルの<script>タグの中に書く
・body要素の配下に書くことができる、基本的にbody要素の中に書く場合は </body>の直前に書く。
そうすることで、描画後にスクリプトが読み込まれるようになる
・head要素の配下に書くことができる、JSは、関数を呼び出すscriptよりも、関数を先に定義しなければいけないので、head要素内に書かないといけないときもある
※個人的にはコードとロジックの分離的な面で、JSは外部ファイルに移すべきではないかと思う。どうなんでしょうか。

##3.イベントハンドラ - タグの中にイベントを書く
・コードとロジックが混在してしまうので、読みにくい
・UIに依存してしまうので、再利用がしにくい。
・修正、変更する際に大変 ※ロジックとコードを分けておけば、ロジックの変更だけですんだりする

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?