HTML事件处理程序与DOM Level 0事件处理程序的区别

Question

HTML事件处理程序与DOM Level 0事件处理程序的区别

javascripthtmleventhandlerinline-codedom-events

5

请问有人可以告诉我HTML事件处理程序和JavaScript中DOM Level 0事件处理程序的实现之间有什么区别吗？

- Jonny

这可能对你有用：https://dev59.com/4FbTa4cB1Zd3GeqP8Ch6 - Drew Gaynor

非常感谢，但它并没有真正回答什么是不同之处。 - Jonny

没有 DOM L0 规范，该术语仅用于指非标准的广泛功能。然后它们被标准化为 HTML。 - Oriol

谢谢！这是我的测试题，他以某种方式解释说：一个使用onclick = ""，另一个则定义一个变量_b = document.getElementby，然后 _b.onclick = ""。 - Jonny

1

我认为这个问题应该被澄清，以明确正在询问什么：a）如何使用其中一种方法注册事件？还是b）浏览器如何实现这两种方法中的每一种？或者可能是c）其他什么......，如果没有前面的任何一个选项，则选择d）关闭它。 - Alin Purcaru

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Paul Sweatte · Answer 1

DOM0事件是在HTML和XHTML规范中定义的声明性事件：

内置事件是与可以在用户执行某些操作时发生特定事件的元素一起使用的属性。以下表格中指示的属性仅在选择定义这些元素的模块时添加到其各自元素的属性集中。

标记语言的某些元素可能具有关联的事件处理程序，当某些事件发生时，这些处理程序将被激活。用户代理需要能够静态地识别那些具有静态关联事件处理程序的元素（即，与内容相关，而不是脚本）。在HTML 4中（[HTML4]，第18.2.3节），“on”前缀开始的属性指定内部事件：onblur，onchange，onclick，ondblclick，onkeydown，onkeypress，onkeyup，onload，onmousedown，onmousemove，onmouseout，onmouseover，onmouseup，onreset，onselect，onsubmit和onunload。

Internet Explorer对于使用属性分配的DOM Level 0方法定义的事件处理程序具有正确的范围，但在使用attachEvent()时没有。

Level 0 DOM支持以下节点列表：

document.images[]，允许访问页面上的所有图像。 document.forms[]，允许访问页面上的所有表单。 document.forms[].elements[]，允许访问一个表单中的所有表单字段，无论它们的标签名是什么。这个节点列表是Level 0 DOM独有的；W3C DOM没有类似的构造。 document.links[]，允许访问页面上的所有链接（）。 document.anchors[]，允许访问页面上的所有锚点（）。

此规范中定义的焦点事件按照一定的顺序相对于彼此发生。当焦点在元素之间移动时（假设没有元素被初始聚焦），以下是事件的典型顺序：

事件名称备注 1. focusin 在第一个目标元素接收焦点之前发送 2. focus 在第一个目标元素接收焦点后发送 3. focusout 在第一个目标元素失去焦点之前发送 4. focusin 在第二个目标元素接收焦点之前发送 5. blur 在第一个目标元素失去焦点后发送 6. focus 在第二个目标元素接收焦点后发送

以下是在元素之间切换焦点时的典型事件顺序，包括已弃用的DOMFocusIn和DOMFocusOut事件。所示顺序假定没有元素被初始聚焦。

C.2.1 传统的FocusEvent事件顺序

事件名称备注 1. focusin 在第一个目标元素接收焦点之前发送 2. focus 在第一个目标元素接收焦点后发送 3. DOMFocusIn 如果支持 4. focusout 在第一个目标元素失去焦点之前发送 5. focusin 在第二个目标元素接收焦点之前发送 6. blur 在第一个目标元素失去焦点后发送 7. DOMFocusOut 如果支持 8. focus 在第二个目标元素接收焦点后发送 9. DOMFocusIn 如果支持

HTML事件是在DOM规范中定义为HTMLEvents的命令式事件。

<iframe src="https://www.w3.org/DOM/Graphics/dom2-map.svg" width="900" height="400"></iframe>
<img src="https://www.w3.org/TR/DOM-Level-3-Events/images/eventflow.svg" width="400" height="400"/>

参考资料