ドキュメントを動的に変更する(1)
DHTML(Dynamic HTML)は、HTMLタグの属性を動的に変更できます。
<html>
<body>
<script language="Javascript">
function Click_Sub() {
if (document.all.div1.style.display == "none") {
document.all.div1.style.display = "block"
} else {
document.all.div1.style.display = "none"
}
}
</script>
<input type="button" onclick="Click_Sub()" value="クリック">
<div id=div1>表示・非表示</div>
</body>
</html>
|
【説明】
<span>でonclickというイベントが起こると、<span>のdisplay(表示/非表示属性)を切り替える。
display・・・block(表示),none(非表示),指定なし(表示)
サンプル
ドキュメントを動的に変更することで、イベントに対してさらに動きがでます。
この例のようにdisplayを使用した場合、表示・非表示を利用して、ツリービューやタブなどの動きも可能です。
サンプル
関連リンク
DHTMLとは
DHTMLの基本
DHTMLで使用できるイベント
ドキュメントを動的に変更する(2)
ドキュメントを動的に変更する(3)
ドキュメントを動的に変更する(4)
スポンサードリンク
| |