了解JavaScript的dom0事件模型

db2dz4w8  于 2023-01-29  发布在  Java
关注(0)|答案(1)|浏览(106)

我试着表达一下我在阅读一些关于JavaScript中的dom0事件模型的文章时所理解的内容,如果有错误,请指正。
在dom0模型中,一个元素可以附加一个事件处理器,但只能附加一个处理器,当事件发生时,浏览器调用该事件处理器。
有两种方法可以做到这一点:

    • 1.直列式型号**

句柄是作为元素的属性添加的,例如一个link元素(即<a>)有一个名为onclick的属性,我们添加一个函数hello如下:

<a href="#" onclick="hello();"> say hello </a>
...
<script type="text/javascript">
   function hello(){
      window.alert("Hello");
   }
</script>

这个模型的问题在于它是侵入式的,因为hello()被放在元素的主体中。

    • 2.传统模式**

处理程序的添加/删除不是在元素的主体中添加事件处理程序作为元素的属性,而是通过脚本完成的。处理程序被分配给元素的属性,如下所示:

<a href="#" id="hellolink">  say hello </a>
...
<script type="text/javascript">
    function hello(){
        window.alert("Hello");
    }
    //adding handler
    document.getElementById('hellolink').onclick=hello;
</script>
tv6aics1

tv6aics11#

似乎是对的。
您可能想阅读:http://en.wikipedia.org/wiki/DOM_events#Traditional_model
对于传统模型中的代码,您应该有一个window.onload事件
所以

window.onload = function () {

    var el = document.getElementById('hellolink');
    if (el) {
        el.onclick = hello;
    }
};

函数hello可能会接收元素对象,这取决于您使用的浏览器,因此如果您使用jQuery之类的东西来处理dom事件,可能会更容易。
http://api.jquery.com/click/

相关问题