js事件处理程序 Uncaught TypeError: Cannot read property 'addEventListener' of null-CSDN博客

本文链接：https://blog.csdn.net/azirong/article/details/77503792

在写跨浏览器的事件处理程序时，遇到这个bug：

Uncaught TypeError: Cannot read property 'addEventListener' of null

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<button class="btn">跨浏览器的事件处理程序</button>

<script>
    var btn = document.getElementById('btn');
    var handler = function () {
        alert('clicked');
    };

    var EventUtil = {
        addHandler : function (element, type, handler) {
            if (element.addEventListener) { // DOM2级 事件处理程序
                element.addEventListener(type, handler, false);
            } else if (element.attachEvent) {
                element.attachEvent('on' + type, handler); // IE 事件处理程序
            } else {
                element['on' + type] = handler;  // DOM0级 事件处理程序
            }
        },
        removeHandler : function (element, type, handler) {
            if (element.addEventListener) { // DOM2级 事件处理程序
                element.removeEventListener(type, handler, false);
            } else if (element.attachEvent) {
                element.detachEvent('on' + type, handler); // IE 事件处理程序
            } else {
                element['on' + type] = null;  // DOM0级 事件处理程序
            }
        }
    };
    EventUtil.addHandler(btn, 'click', handler);
</script>
</body>
</html>