HTMLからJavascriptを動かす：<input>タグの利用

Canvasを用いればHTMLからJavascriptを動かすことができますが、それ以外にもHTMLからJavascriptを動かすことができます。
今回はHTMLの<input>タグを用いてボタンを作りそれでJavascriptを動かします。



具体的に今回のスクリプトは以下のHTMLの<input>タグでJavascriptを動かしています。

<input type="button" name="clearcanvas" value="クリア" onClick="clearcanvas()">

input type="button"：ボタンの作成を指定します。ボタン以外にもチェックボックスやラジオボタン等を指定できます。

name="clearcanvas"：<input>タグに名前を付けます。この名前を参照にしてスクリプトを動かすこともできます。

value="クリア"：HTMLに表示されるボタンの名前を付けます。

onClick="clearcanvas()"：ボタンを押したときどのように動作するのかを指定します。今回はボタンを押すとclearcanvas関数が動きます。







前回のお絵かきスクリプトにクリアボタンを追加しました。
このボタンをクリックするとclearcanvas関数が実行されてcanvas要素がクリアされます。