はじめに
この記事はWebの基礎をおさらいカレンダー Advent Calendar 2022です。
このカレンダーでは、なんとなくわかった気になっている、Webの知識をおさらいするカレンダーです。
興味をもし持ってくださった方は、購読いただけると嬉しいです！
今回はJavaScriptについて説明します！
JavaScriptとは
Webページで複雑な機能を提供するためのプログラミング言語です。
HTMLで、文書の構造を示し、CSSで見た目を装飾し、JavaScriptで動きをつけます。
例えば、
Qiitaでいいねボタンを押すと即座に数字が反映されたり、通知が届いたりするのはJavaScriptの機能を使用して実現されています。
JavaScriptはECMAScriptという標準規格によって基本的な使用が決められています。
かつて、ブラウザによって仕様の違いが大きく、統一するためにECMA Internationalという団体によってこの標準規格が作成されました。
JavaScriptの規格のバージョンをES5, ES6などと表現することもあるので、覚えておきましょう。
この規格のバージョンが対応されているかによって、同じ処理でも書き方が違ったり、ブラウザによっては動かなかったりすることもあるので、
注意しましょう。
Can I useというサイトでブラウザの対応状況を見ることができるので、そちらからチェックしてください。
読み込み方法
<script>タグを使用します。
下記のように直接囲んで読み込むやり方と<script src="js/hoge.js"></script>のように、ファイルを読み込むやり方があります。
<script>
alert('hello world')
</script>
JavaScriptを覚えていく上で
JavaScriptは色々できるので、学習を始める際に、何をしたらいいんだろう？と最初はなるかと思います。
個人的にまずここから試していくと良いと考えているのは、DOM操作です。
(DOMについてはこちらで説明しているので、参照ください)
文字の色を変えたり、内容を変えてみましょう。
<p id='hoge'>ハローワールド</p>
document.getElementById('hoge').innerText = 'ヘローワールド'; // 文字がヘローワールドに変わる
document.getElementById('test').style.color = 'blue' // 文字が青色に変わる;
DOM操作に慣れてくると、じゃあこの文字をクリックしたらこういう動きを付けよう、だとか
色々な表現方法を少しずつ取り入れていくことができるようになると思います。
まとめ
以上、JavaScriptについての説明でした！
Webの基礎をおさらいカレンダー Advent Calendar 2022でした。
興味をもし持ってくださった方は、購読いただけると嬉しいです！