在Web开发中，事件处理是前端编程的核心部分之一。它允许开发者捕捉用户操作（如点击、鼠标移动、按键等）并作出响应。由于不同浏览器对事件处理的支持差异，使用兼容性良好的方法注册事件尤为重要。
本文讨论了如何通过JavaScript（JS）原生实现跨浏览器的事件注册方法。我们看到一个封装好的库，它提供了两个主要的函数：`addListener`和`removeListener`。这两个函数分别用于添加和移除事件监听器，以便在不同的浏览器上都能正常工作。
`addListener` 函数接受三个参数：要注册事件的元素（element），事件类型（type），以及事件处理函数（fn）。在函数内部，首先通过`typeof element == 'undefined'`检查确保传入了有效的元素。接着，函数会检查元素是否支持`addEventListener`方法，这是在标准的DOM Level 2事件规范中定义的，现代浏览器如Chrome、Firefox和Safari都支持此方法。
如果`element.addEventListener`存在，直接使用此方法添加事件监听器。此方法接受三个参数：事件类型、事件处理函数以及一个布尔值，指明事件是否在捕获阶段或冒泡阶段触发。在这里，使用了`false`表示事件在冒泡阶段触发。
在不支持`addEventListener`的浏览器中，如旧版的Internet Explorer，它使用`attachEvent`方法。这种方法只在冒泡阶段触发事件，并且有一个与之相关的问题：它将事件的`this`指向全局对象`window`而不是绑定到触发事件的元素。为了修复这个问题，封装的代码创建了一个包装函数`nestFn`，并使用`apply`方法将`this`指向正确的元素。
此外，为了处理旧版IE中匿名函数无法移除的问题，使用了一个事件缓冲区数组`_EventRef`。这是一个私有属性，存储了所有通过`addListener`添加的事件处理函数的引用。这样，就可以确保事件处理函数可以被正确移除，即使是匿名函数也不例外。
`removeListener`函数的实现逻辑与`addListener`相似，主要目的是兼容旧版IE。检查元素是否具有`removeEventListener`方法。如果存在，则直接使用该方法移除事件监听器。如果不存在，则检查是否具有`detachEvent`方法，并以类似的方式操作事件缓冲区数组`_EventRef`。
这段代码通过一个立即执行的函数表达式（IIFE）进行封装，并向全局对象`window`添加了一个`cm`对象。这个对象包含了`addListener`和`removeListener`方法，使得其他脚本可以安全地使用这些事件处理方法，而不用担心全局命名空间的污染。
通过这种封装方法，开发者可以不必担心跨浏览器兼容性问题，从而更专注于实现功能逻辑。这种方法虽然在现代Web开发中可能会更多使用框架和库，比如jQuery或现代的前端框架，但理解其背后的基本原理依然非常重要，因为这有助于更好地控制代码，以及在没有现代框架支持的情况下仍能兼容旧浏览器。
