タイマーを使おう！
マウスの有効範囲を指定２ |
イベント |
１ |
プロパティの変化の認識 |
プロパティっていうのは何かわかるかな。
パソコン上で右クリックをするとよくプロパティっていうのがでてくるよね。
これをクリックしてみてみると、現在指定しているものに関していろいろな情報がかかれていると思う。
そう、プロパティというのはそのものにつけられている属性などの情報なんだ。
つまり、あるタグで言うと、太字になっていたり、色がついていたりするのは全てプロパティなんだね。
だから、プロパティの変化を認識するということは、あるタグの文字の色が赤から青に変わるなど、プロパティが変化した時にそれを認識できるということなんだ。
これを使えば、何かを変化させた時にその情報をユーザーに伝えることができるんだよ。
じゃあ、これを使って、何か変化をさせたときにその変化を伝える命令をやってみよう。
<HTML>
<HEAD>
<SCRIPT language="JavaScript">
<!--
var color = "0";
function tell(){
alert("色を変化させました"); ←警告ウィンドウを出す
}
function colorChange(){
if(color == "1"){
font.style.color = "#ff0000"; ←色を赤に変える(今はわからなくてもよい)
color = 0;
}
else{
font.style.color = "#0000ff"; ←色を青に変える(今はわからなくてもよい)
color = 1;
}
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<SPAN id="font" style={color:red;} onpropertychange="tell()">ヨッシーの”ホームページを作ろう！”</SPAN><P>
↑文字の色(プロパティ)が変化した時にtell()を実行。
<INPUT type="button" value="色変化" onclick="colorChange()">
↑ボタンを押すとcolorChange()を実行
</FORM>
</HTML>
|
これを実行すると、
|
ヨッシーの”ホームページを作ろう！”
↑文字に注目！ボタンを押して文字を変えるとウィンドウが出る |
このように、あるものが変化した時にそれに連動してある命令を出すことができるんだ。
これを利用すると、さまざまなタグを連動させたスクリプトも作ることができるね。