Webの記録

苦手なJavaScriptをイチから勉強してみる【JavaScriptを外部ファイルにする】

投稿日:2013年1月14日 更新日:

この記事は約 2 分で読めます。

苦手なJavaScriptをイチから勉強してみる【関数編】の続きとしてメモします。

イチから「JavaScript」を学び直しをする為に記録を残しています。少しずつメモを追加していきます。

私の個人的なメモなので、ちょっと違うよ!とか、こうしたら?というのがあると思います。その場合はこっそりコメント等頂けると有難いです!

少しずつメモしているので、連載的な感じで続きを書いていってます。過去のメモも、時々追記していきます。超・初心者向けです。

今回は、「外部化」させる事についてメモしています。



JavaScript勉強の流れ

  1. 基本準備編
  2. 記述の基礎編
  3. イベント編
  4. 関数編
  5. JavaScriptを外部ファイルにする←今回はココ。
  6. 条件分岐(if文)と繰り返し処理(for文)


JavaScriptを外部ファイルにするメリット

同じJavaScriptを複数のファイルで何度も実行させる場合、毎回全く同じ記述していたら効率が悪いです。なのでJavaScriptを外部化(ひとまとまりの部品)にしておくことで、使い回しが可能になります。

JavaScriptを外部ファイルにする方法

JavaScriptの部分のみを外部ファイルとして保存させます。以下の部分だけ「●●.js」というファイルで保存させます。拡張子は必ず「js」。
(例:jsフォルダの中に「sample.js」で保存)

これをhtmlで読み込みます(headやbodyの中など)

//例
<script type="text/javascript" src="js/sample.js"></script>


JavaScriptを外部化できたので、複数のhtmlからでも同様にJavaScriptを読み込みすることができるようになりました。

次回は、「条件分岐(if文)と繰り返し処理(for文)」について書きます。

-Webの記録
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

This blog is kept spam free by WP-SpamFree.

関連記事

no image

simplegallery.jsでシンプルだけど高機能なスライドショーを作ってみた♪

この記事は約 1 分で読めます。今回は、数枚の画像でスライドショーを「simplegallery.js」で作ってみたいと思います。 名前の通りシンプルですが、なかなか高機能で取付けも簡単に出来たので、 …

no image

s3Slider.jsを使ってFlashのようなスライドショーにチャレンジ♪

この記事は約 1 分で読めます。今回も、画像数枚のスライドショーをjQueryのライブラリを使って作ってみたいと思います。 今回チャレンジしてみたのは、「s3Slider.js」を使ったFlashのよ …

no image

WordPress 「Contact Form7」で送信完了画面と自動送信メールを試してみた

この記事は約 2 分で読めます。 WordPressの「Contact Form7」は、お問い合せフォームを簡単に取り付ける事が出来るという便利なプラグインです。 以前から利用しているのですが、最近ま …

no image

WordPressでオリジナルテーマ作りにチャレンジ8【トップページ編】

この記事は約 1 分で読めます。 今回、WordPressのオリジナルテーマ作りにチャレンジしました。 ブログサイトならトップページを特別に作る必要はないのかもしれませんが、通常のサイト「index. …

no image

「ページ内リンクはするするスクロール」にチャレンジ!!

今日は・・・、「ページ内リンク」でちょっとイイカンジにスクロールするjQueryにチャレンジです。
ページ内リンクをそのまましても(javaScriptなし)出来ますが、そのままだといきなり戻り先に到着してしまってびっくりするので、「yuga.js」でするするという動きをつけてみました。