javascript - 检测是否支持事件监听器

Question

是否可以检测某些浏览器是否支持某些事件？我可以检测浏览器是否支持document.addEventListener，但我需要知道它是否支持该事件DOMAttrModified。Firefox 和 Opera 支持它，但 Chrome 和其他不支持。

Answer 1

更新答案：

是的，您可以对此进行特征检测。创建一个元素，监听事件，并更改元素的属性。在我的测试中，您甚至不必将元素添加到 DOM 树中，这使它成为一个很好的、包含的特征检测。

例子：

function isDOMAttrModifiedSupported() {
    var p, flag;

    flag = false;
    p = document.createElement('p');
    if (p.addEventListener) {
        p.addEventListener('DOMAttrModified', callback, false);
    }
    else if (p.attachEvent) {
        p.attachEvent('onDOMAttrModified', callback);
    }
    else {
        // Assume not
        return false;
    }
    p.setAttribute('id', 'target');
    return flag;

    function callback() {
        flag = true;
    }
}

实时复制

Firefox 触发上述所有修改的回调；Chrome 上没有一个。

---

原始答案：

您可以功能检测是否支持某些事件，如这个方便的页面所示。我不知道您是否可以专门针对该代码进行测试，但如果可以，该代码很可能会帮助您入门。

更新：我将 Kangax 的代码转储到 JSBin中并进行了尝试，看起来嗅探技术不适用于该事件（除非我的名称拼写错误或其他东西；Firefox 显示“假”）。但是我上面的技术可以。

Answer 2

function isDOMAttrModifiedSupported () {
    var supported = false;
    function handler() {
      supported = true;
    }
    document.addEventListener('DOMAttrModified', handler);
    var attr = 'TEST';
    document.body.setAttribute(attr, 'foo'); // aka $('body').attr(attr, 'foo');
    document.removeEventListener('DOMAttrModified', handler);
    document.body.setAttribute(attr, null);
    return supported;
  }