0

我试图表达我通过阅读一些文章所理解的内容dom0 event model。javascript如果其中有错误，请纠正我。

在 dom0 模型中，一个事件处理程序可以附加到一个元素。只能附加一个处理程序。当事件发生时，浏览器调用该事件处理程序。

有两种方法可以做到这一点

1.内联模型

处理程序被添加为元素的属性。例如link element（即<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>
4

1 回答 1

2

似乎是对的。

您可能想阅读： http : //www.cross-browser.com/talk/event_interface_soup.php 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/

于 2012-05-09T07:44:43.423 回答