この記事で分かること
alert()の基本動作- 警告ダイアログの表示方法
- 改行(
\n)を使ったメッセージ整形 - リンクやボタンの
onclickと組み合わせる方法 - 初心者がつまずきやすいポイント
alert() は、JavaScript で最も基本的なダイアログ表示メソッドです。
メッセージをポップアップ表示し、ユーザーに注意を促したり、確認前の案内を行う際に利用されます。
alert() とは?
alert() は、[OK] ボタンだけを持つ警告ダイアログを表示するメソッドです。
alert("メッセージ");
- ユーザーが OK を押すまで次の処理へ進まない(ブロッキング)
- ダイアログが表示されている間、ブラウザ操作はできない
- リンクやボタンの
onclickと組み合わせて使える
基本的な使用例
alert("未入力の項目があります");
→ 「未入力の項目があります」という警告ダイアログが表示されます。
リンククリック時に alert を表示する
<a href="http://books.ank.co.jp/" onclick="alert('書籍サイトに移動します。')">
書籍サイトへ
</a>
→ リンクをクリックすると「書籍サイトに移動します。」と表示されます。
alert の改行方法
ダイアログ内で改行したい場合は、\n(バックスラッシュ + n) を使います。
"1行目の文字列\n2行目の文字列\n3行目"
複数の文字列を連結しても OK です。
"1行目\n" + "2行目と\n" + "3行目"
→ ダイアログ内で3行に分かれて表示されます。
JavaScript 初心者におすすめの学習書籍
書籍で学ぶのが向いている人
alert()・confirm()・prompt()などの基本ダイアログを体系的に理解したい- ユーザー操作に応じた処理(
onclickなど)を基礎から学びたい - ネット記事だけだと情報が断片的に感じる
alert() のような警告ダイアログは、
JavaScript の 基本文法・イベント処理・ブラウザ標準UI の理解が欠かせません。
書籍ではこれらを順序立てて学べるため、メッセージ表示や入力確認の仕組みを深く理解できます。
いちばんやさしい JavaScript の教本
図解が多く、JavaScript の基本動作やブラウザの仕組みを視覚的に理解できる入門書です。
alert() / confirm() / prompt() の
「標準ダイアログの役割」や「イベントとの組み合わせ」も丁寧に学べます。
この本で解決できること:
alert()の基本動作と使いどころが理解できるonclickと組み合わせた実用的な書き方が身につく- 実際に動くサンプルでダイアログ処理の理解が深まる
確かな力が身につく JavaScript「超」入門
イベント処理・UI 操作・ブラウザ動作など、より実践的な JavaScript を学びたい方に最適な入門書です。
alert() を使った警告表示や、ユーザー操作に応じた処理分岐も理解できます。
この本で解決できること:
alert()/confirm()/prompt()の使い分けが体系的に学べるonclickを使った実務的な UI 処理が書けるようになる- 現代的な JavaScript の書き方が身につく
動画で理解を深めたい方へ(Udemy講座)
alert() のようなダイアログ表示は、
実際の動作を画面で見ながら学ぶと理解が一気に深まります。
動画では「OK を押すまで処理が止まる」「onclick で表示される」などがそのまま確認でき、
初心者でも直感的に理解できます。
初心者のためのJavaScript 完全入門
基本文法・イベント処理・ブラウザの動作など、alert() の理解に必要な基礎を体系的に学べる人気講座です。
この講座で解決できること:
alert()の動作を視覚的に理解できるonclickと組み合わせた実用的な書き方が身につく- 初心者がつまずきやすい UI 操作の概念を丁寧に解説
→ 初心者のためのJavaScript 完全入門(Udemy)
超JavaScript 完全ガイド 2026
UI 操作・イベント制御・ブラウザ動作など、実務で必要な JavaScript を深く理解したい方に最適な講座です。
この講座で解決できること:
alert()を使った実践的な警告表示が身につく- ユーザー操作に応じた分岐処理の考え方を習得できる
- 現代的な JavaScript の書き方をまとめて習得
体系的に学びたい方へ(スクールという選択肢)
独学の限界を感じやすいポイント
alert()・confirm()・prompt()の違いが曖昧なままになるonclickを使った UI 処理が断片的になりやすい- ユーザー操作に応じた分岐処理でつまずいても相談できない
- 学習の順番に自信が持てない
スクールでは、プロの講師が学習ロードマップを作成し、
alert() を含むダイアログ処理や
JavaScript の基礎を体系的に理解できるようサポートしてくれます。
無料相談で得られるメリット
- あなたのレベルに合わせた学習計画を作成
alert()・イベント処理・UI 操作の理解を深めるアドバイスがもらえる- 効率的な学習方法をプロが提案
- エンジニア転職を視野に入れたキャリア相談も可能
JavaScript を効率よく学びたい方には、未経験からエンジニアを目指せる
DMM WEBCAMP の学習コースも選択肢のひとつです。
alert() に関するよくある質問(FAQ)
alert() は何ができる?
メッセージを表示し、ユーザーに OK を押してもらうための警告ダイアログを表示できます。
改行するにはどうすればいい?
\n を使うことで alert ダイアログ内で改行できます。
リンクやボタンと組み合わせて使える?
onclick に alert() を書くことで、クリック時にメッセージを表示できます。
スマホで alert が表示されないことはある?
一部ブラウザではブロックされる場合があります。必要に応じてモーダルUIの利用を検討してください。
まとめ
alert()は OK ボタンだけの警告ダイアログを表示する- ユーザーが閉じるまで次の処理へ進まない(ブロッキング)
- リンクやボタンの
onclickと組み合わせて使える - 改行は
\nを使う