コンテンツにスキップ

JavaScript:ボタンと関数

これはなに?

ボタンをクリックしてJavaScriptのプログラムを動かす方法

関連項目


ボタン

ボタンの表示例

<button>押して!</button>

ボタンから起動するプログラムを書く

function (関数・かんすう)を使ってプログラムを書きます。

<script>
function hyouji()
{
alert("今日のおやつはポテチだよ");
alert("君も食べるかい?");
}
</script>

関数 というのは、プログラムをまとめて名前を付けたものです。


ボタンから起動できるようにする

button タグの onclick で関数を呼び出します。 onclick は「クリックされたら」という意味です。

<button onclick="hyouji()">押して!</button>

まとめ

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ボタン</title>
<script>
function hyouji() {
alert("今日のおやつはポテチだよ");
alert("君も食べるかい?");
}
</script>
</head>
<body>
<button onclick="hyouji()">押して!</button>
</body>
</html>