使用 HTML DOM 来分配事件

HTML DOM 允许您通过使用 JavaScript 来向 HTML 元素分配事件:

这是什么意思呢?我们先看一段HTML代码:

<!DOCTYPE html>
<html>
<body>

<p>点击按钮就可以执行 <em>displayDate()</em> 函数。</p>

<button onclick="displayDate()">点击这里</button>

<script>
function displayDate()
{
document.getElementById("demo").innerHTML=Date();
}
</script>

<p id="demo"></p>

</body>
</html>

这段代码很简单,就是在点击button时调用displayDate()函数,因为我学习的还不深入,但是以我面向对象基础感觉,这样没有很好封装的感觉,应该声明好该有的控件,然后在javascript部分来定义这些控件在某些事件产生时该执行什么动作,

<!DOCTYPE html>
<html>
<head>
</head>
<body>

<p>点击按钮就可以执行 <em>displayDate()</em> 函数。</p>

<button id="myBtn">点击这里</button>    //声明控件

<script>
document.getElementById("myBtn").onclick=function(){displayDate()};  //控件某些事件产生时执行的动作
function displayDate()
{
document.getElementById("demo").innerHTML=Date();
}
</script>

<p id="demo"></p>

</body>
</html>

虽然很简单,但是作为初学,还是记录一下。

使用 HTML DOM 来分配事件,古老的榕树,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。