このカテゴリでは、Webページに動きを加える JavaScript の基礎を学びます。
ボタンのクリックやフォーム入力に反応する処理、画面表示の切り替えなど、実務でよく使われる操作を中心に解説しています。
JavaScriptを使えるようになると、ユーザーにとって使いやすいWebページを自分で実装できるようになります。
フロントエンドの基礎として、PHPと組み合わせる前にしっかり理解しておきましょう。
Web開発学習ロードマップ 5-7 JavaScriptエラーの見方とデバッグ方法
JavaScriptを書き始めると、必ず直面するのが エラー です。・画面が動かない・クリックしても何も起きない・赤いエラーが出て不安になるしかし、これは異常ではありません。JavaScriptにおいて、エラーは日常です。重要なのは、エラー...
Web開発学習ロードマップ 5-6 JavaScriptでできる簡単な実装例（表示切替・入力チェック）
前の記事までで、次の知識がそろいました。・DOMとは何か・DOMの取得と操作・イベント処理（click / change）しかし、この段階で多くの人が感じます。・理解はしたけど、何が作れるのか分からない・知識が点でバラバラな感じがするそこで...
Web開発学習ロードマップ 5-5 イベント処理の基本（click / change）
前の記事では、JavaScriptで DOMを取得し、操作できる ことを学びました。しかし、取得して操作するだけでは、ページは自動では動きません。Webページが本当に「動く」ようになるのは、ユーザーの操作に反応できるようになったとき です。...
Web開発学習ロードマップ 5-4 DOMの取得と操作の基本
前の記事では、DOMとは何か、なぜJavaScriptでHTMLを操作できるのかという 仕組みの部分 を理解しました。次に必要なのは、実際にDOMを扱う方法 です。・どの要素を対象にするのか・どうやって取得するのか・取得したあと、何ができる...
Web開発学習ロードマップ 5-3 DOMとは何か｜JavaScriptがHTMLを操作する仕組み
JavaScriptを学び始めると、ほぼ必ず次の疑問にぶつかります。・なぜJavaScriptでHTMLを書き換えられるのか・クリックすると表示が変わる仕組みが分からない・どこまでがHTMLで、どこからがJavaScriptなのか曖昧この疑...
Web開発学習ロードマップ 5-2 JavaScriptの基本文法
前の記事では、JavaScriptが・Webページに動きを与える・ユーザー操作に反応するための言語であることを学びました。ここからは、実際にJavaScriptを書くために必要な基本文法 を整理していきます。この記事の目的は、「すべて覚える...
Web開発学習ロードマップ 5-1 JavaScriptとは何か｜Webページに動きを与える仕組み
ここまでで、HTMLとCSSを使って・ページの構造を作る・見た目やレイアウトを整えることができるようになりました。しかし、HTMLとCSSだけでは、次のようなことはできません。・ボタンを押したら表示が変わる・入力内容に応じてチェックする・画...