1.2 JavaScriptってどういうもの? 【JavaScript超入門】
JavaScriptの学習メモ。
今日は『確かな力が身につくJavaScript「超」入門』の第1章を読んでみます。
1.2 JavaScriptってどういうもの?
(p.5)
ブラウザを操作するためのプログラミング言語
で、
HTMLやCSSだけではできないことをする
ために使います。
確かに、JavaScriptはもともとブラウザーを操作するために作られたプログラミング言語でしたが、今は用途が広がって、ブラウザーを操作する以外の用途でも使われています。
とりあえず、JavaScriptの本来の使い方である「ブラウザーを操作」する目的で、使い方を学んでみたいと思います。
「ブラウザを操作する」ってどういうこと？
(p.5)
JavaScriptは、一般的なブラウザである、Chrome、Firefox、Internet Explorer（以下IE）/ Edge、Safariなどで実行することができるプログラミング言語です。
JavaScriptで何かプログラムを書いておけば、ブラウザはその命令どおりの処理をしてくれるのです。
ブラウザーには、JavaScriptのプログラムを実行する仕組みが備わっています。
(p.6)
HTMLとCSSには重要な特徴があります。
それは、一度ブラウザに読み込まれたらもう変化しないということです。
HTMLとCSSは不変で、静止したデータといえます。
JavaScriptを使うと、これら静止したデータであるHTMLやCSSを、その場でリアルタイムに書き換えて、一部のコンテンツを入れ替えたり、画像のスライドショーのような動きをつけたりすることができます。
具体的な「書き換え」の例
(p.6)
パターン１： タグに囲まれたテキストを書き換える
<p>AAA</p>
↓
<p>BBB</p>
パターン２： 要素を追加・削除する
<ul>
<li>1行目</li>
</ul>
↓
<ul>
<li>1行目</li>
<li>2行目</li>
</ul>
パターン３： タグの属性の値を変更する
<img src="apple.jpg">
↓
<img src="banana.jpg">
パターン４： CSSの値を変更する
body {
background: #FFFFFF;
}
↓
body {
background: #FF0000;
}
(p.8)
これら４つのパターンでHTMLやCSSが書き換えられると、その変更がブラウザの表示に即座に反映されます。
しかも、画面が描き替わるのは変更があった箇所だけで、ページ全体の再読み込みは発生せず、待ち時間もありません。
これにより、単なる「ホームページ」ではない、より「アプリ」らしい動きのWebページを作ることができます。
「HTMLやCSSだけではできないことをする」ってどういうこと？
これ以外にも、JavaScriptにできることはたくさんあります。
JavaScriptの最も基本的で、かつ重要な役割は次の２点です。
この２つの役割はとても大事なので頭に入れておいてくださいね。
この本を通して学ぶのは、JavaScriptを使ってHTMLやCSSをいろいろな方法で書き換えて、ページのコンテンツを変えたり、動きをつけたりする方法です。
JavaScriptには、HTMLやCSSの操作で
- 読む（read）
- 書く（write）
という２つの基本的な役割があるんですねー。（覚えておこう）
確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ)
- 作者: 狩野祐東
- 出版社/メーカー: SBクリエイティブ
- 発売日: 2015/10/30
- メディア: 単行本
- この商品を含むブログを見る
