自定义DOM事件是在DOM3中定义的，它不是由DOM原生触发。自定义事件只能通过addEventListener方式添加，其它如内联到html或DOM0方式（el.onXXX=fn）添加的不能触发。如
<!-- 内联事件代码 -->
<div id="d1" onmyevent="alert(this)">DIV1</div>
<script>
// DOM 0 方式添加
d1.onmyevent = function(){alert(this)}
</script>
以下方式可以
<!DOCTYPE html>
<html>
<head>
<title>模拟DOM自定义事件</title>
<meta charset="utf-8">
<style>
div {
background: gold;
margin: 10px;
}
</style>
</head>
<body>
<!-- 内联事件代码 -->
<div id="d1" onmyevent="alert(this)">DIV1</div>
<script>
function $(id) {return document.getElementById(id)}
function hander(event) {
alert(event.detail + this.tagName + '')
}
var div = $('d1'), customEvent
div.onmyevent = function(){alert('DOM 0')}
div.addEventListener('myevent', hander, false)
document.body.addEventListener('myevent', hander, false)
try {
customEvent = document.createEvent('CustomEvent')
customEvent.initCustomEvent('myevent', true, false, 'Hello, ')
div.dispatchEvent(customEvent)
} catch(e) {
// 仅IE6/7/8不支持
alert('Don\'t support DOM CustomEvent')
}
</script>
</body>
</html>
给页面中div，body添加了一个自定义事件myevent，通过document.createEvent创建一个自定义事件对象，初始化。最后使用dispatchEvent主动派发事件。
测试发现IE9/Safari5/Chrome21/Firefox15/Opera12 : 依次弹出了“Hello，DIV”，“Hello，BODY”。说明还冒泡到body上了。
注意：内联HTML事件及DOM 0事件均没有触发。
相关：
相关推荐
本文将深入探讨如何使用JavaScript（js）编写兼容360、Firefox、Chrome、Opera、傲游、搜狗和世界之窗等主流浏览器的弹窗代码，以及为何不支持Safari和IE8及以下版本的浏览器。 首先，我们了解JavaScript弹窗的基本...
这里我们探讨的是Firefox、Chrome和Safari浏览器中内置的两个便捷的调试函数：$ 和 $$。 首先，$ 函数在这些浏览器中等同于 `document.getElementById`。这是一个非常实用的功能，因为`getElementById`是JavaScript...
- **Firefox**、**Chrome**、**Opera**、**Safari**：这些现代浏览器通常具有良好的DOM支持，因此代码在这些浏览器中的表现会更好。 #### 总结 本文介绍了如何通过JavaScript实现层跟随滚动条移动的技术方案，包括...
比如，Internet Explorer较早地引入了数据岛功能，但其他浏览器如Chrome、Safari和Opera可能需要依赖额外的库或技术，如jQuery的`.data()`方法或Web Components的模板特性来实现类似的功能。这些浏览器可能不直接...
例如，IE10及以下版本不支持事件捕获，而其他现代浏览器如IE11、Chrome、Firefox和Safari则同时支持捕获和冒泡。 JavaScript提供了`addEventListener`方法来添加事件监听器。该方法接受三个参数：事件名、处理函数...
"js实现浏览器全屏兼容谷歌火狐等"这个主题就涉及到如何使用JavaScript来实现在不同浏览器上实现全屏功能，并确保与主流浏览器如Google Chrome和Mozilla Firefox等的兼容性。这里我们将详细讲解这一技术实现的原理和...
然而，在DOM2级事件规范中，目标元素在捕获阶段不会接收到事件，但在某些浏览器中，如Safari、Chrome、Firefox和Opera 9.5及以上版本，目标元素在捕获阶段也会触发事件处理程序。 4. 阻止事件冒泡： 在某些情况下...
- 提供的代码主要针对IE、Firefox和Chrome，但对其他浏览器如Safari、Opera或其他基于Chromium的浏览器可能需要额外的适配。 总之，为了实现跨浏览器的“设为首页”和“加入收藏”功能，开发者需要编写特定于...
首先，`addEventListener` 是 W3C 标准推荐的事件处理方式，适用于所有支持 W3C DOM Level 2 的浏览器，如 Chrome、Firefox、Safari 和 Opera。这个方法接收两个参数：一个是事件名，另一个是事件处理函数。例如，...
它确保在IE8及更高版本，以及其他现代浏览器如Chrome、Firefox、Safari和Opera中都能正常工作。 2. **易用性**：这款插件的集成和使用相当简单。只需要在页面中引入jQuery和DCalendar的JS文件，然后通过简单的...
- **Firefox 3.6/Chrome 7/Safari 5**： - `mousedown` 和 `mouseup` 事件中获取中键值为 **1** - `click` 事件也能获取中键值，同样为 **1** - **Opera 10**： - 无法获取中键值，因为Opera不触发与中键相关的...
支持全部主流浏览器，包括IE、Firefox、Safari、Chrome和Opera，使得这种技术具有广泛的适用性。 首先，我们需要理解jQuery的基本语法。jQuery的核心在于选择器，它允许我们高效地定位到页面上的特定元素。例如，`$...
- **Firefox**：Firefox及其他遵循W3C标准的浏览器，如Chrome、Safari和Opera，使用`addEventListener`方法来添加事件监听器。相应的代码为`element.addEventListener('click', foo, false)`。 2. **事件冒泡与...
在非IE浏览器中，如Firefox、Safari 和 Opera，它们遵循DOM标准，因此也支持这两种事件流。 事件触发的顺序在不同的浏览器中有所不同。在IE中，使用`addEventListener`动态添加事件时，遵循“先进先出”原则，即先...
这个事件主要在Internet Explorer浏览器中被广泛使用，因为它是IE特有的，而在其他遵循W3C标准的浏览器（如Firefox、Chrome、Safari和Opera）中，推荐使用`addEventListener`或`attachEvent`来监听属性变化，通常...
现代浏览器如IE9、Chrome、Firefox、Opera和Safari都支持这些方法。IE8及之前的版本有自己特有的模拟方式。 #### 创建事件对象 在DOM2级规范中，`document.createEvent()`方法可以用来创建一个新的事件对象。这个...
MooTools致力于跨浏览器兼容性，确保在主流的浏览器（如IE6+、Firefox、Chrome、Safari和Opera）上都能正常工作。它通过抽象化浏览器差异，使得开发者无需关心底层的实现细节，更专注于应用逻辑。 八、压缩与非压缩...
- **Firefox 和 Chrome**：可以使用`window.bookmark()`方法，但这种方法在某些浏览器中可能无效。 - **IE 和 Safari**：这些浏览器没有提供直接的API，但我们可以通过创建一个新的URL并调用`window.location....
其他浏览器如IE6/7/8/9、Safari、Chrome和Opera则表现正常，只触发一次事件。 为了解决这个问题，有几种常见的策略： 1. **避免重复绑定**：确保只有一种方式为`<body>`添加点击事件。如果已经在HTML中设置了`...
相较于其他功能丰富的浏览器（例如Opera或Safari），Firefox在保持简洁界面的同时，提供了强大的可扩展性。 在当今互联网时代，一个标准的网络浏览器通常需要具备以下特点： - **精细设计的标签控件**：使得用户...