JavaScript勉強会

JavaScriptの学習日記

2.3 ダイアログボックスを表示する 【JavaScript超入門】

JavaScriptの学習メモ。

今日は『確かな力が身につくJavaScript「超」入門』の第2章を読んでみます。

 

jsstudy.hatenablog.com

 

 

2.3 ダイアログボックスを表示する

(p.50)

コンソールに続いて紹介する2つ目のアウトプットは、ダイアログボックスへのアウトプットです。

使い方はconsole.logとほとんど変わらず、簡単です。

 

<body>
<script>
window.alert('出力したい文字や計算式など');
</script>
</body>

 

上記のHTMLファイルをChromeで開くと、以下のようなアラートダイアログボックスが表示されました。

 

f:id:jsstudy:20170307002654p:plain

 

「OK」ボタンか、右上の「×」ボタンをクリックすると、消えます。

 

アラートダイアログボックス

window.alert() は、windowオブジェクトのalertメソッドです。

 

(p.51)

ここで気をつけておきたいのは、alertはwindowオブジェクトに用意されているメソッドだということです。

同じように、logはconsoleオブジェクトに用意されているメソッドなので、windowオブジェクトに対してlogメソッドを実行せよと指示したり、consoleオブジェクトに対してalertメソッドを実行せよと指示したりすることはできません。

 

次のようなプログラムはエラーになり実行できません。

window.log('windowオブジェクトのテスト表示');

console.alert('consoleオブジェクトのテスト表示');

 

ダイアログボックスとは?

英語の専門用語が出てきたので、意味を調べてみました。

 

e-words.jp

 

ダイアログボックス 【 dialog box 】

ダイアログボックスとは、WindowsMac OSなどの操作画面で、ユーザに何らかの入力を促すために表示されるウインドウのこと。「ダイアログ」は「対話」の意。

他のウインドウよりも手前にポップアップ表示され、テキストボックスやチェックボックス、ボタンなどの入力要素と、入力を促すメッセージが表示される。

表示中はウインドウの外の操作ができなくなる「モーダルダイアログ」(modal dialog)と、他のウインドウの操作を行ってもよい「モードレスダイアログ」(modeless dialog)がある。

単純にメッセージを伝えるためだけのウインドウは「メッセージボックス」と呼ばれる。

 

アラート(警告)を表示するためのダイアログボックスを使えば、JavaScriptのプログラムの中で、中身を確認したいデータを出力することができますね。