Question

我有一个附加活动的功能。

function addEvent(object, type, callback) {
    if (object == null || typeof(object) == 'undefined') return;
    if (object.addEventListener) {
        object.addEventListener(type, callback, false);
    } else if (object.attachEvent) {
        object.attachEvent("on" + type, callback);
    } else {
        object["on"+type] = callback;
    }
};

还有一个小小的按钮来测试

<a href="#" class="btn btn-primary btn-toggle" id="btn-toggle-action">Toggle</a>

我试着打电话，但我已经看过了

addEvent(document.getElementById('btn-toggle-action'), 'click', function(e) {}); //WORKS

addEvent(document.getElementByClassName('btn-toggle'), 'click', function(e) {}); //DON'T WORK

addEvent($('.btn-toggle'), 'click', function(e) {}): //DON'T WORK

addEvent($('#btn-toggle-action'), 'click', function(e) {}); //DON'T WORK

我想了解为什么它无法使用所有方法

Answer 1

首先，写错误：document.getElementByClassName应为document.getElementsByClassName，因为它会选择多个元素。

jquery选择器与原生选择器不同，请参阅document-getelementbyid-vs-jquery

您可以使用更强大的原生选择器，如：

document.querySelector('#btn-toggle-action')

document.querySelectorAll('.btn-toggle')

Answer 2

可能是document.getElementByClassName（'btn-toggle'）返回对象数组。需要：

if(typeof object === 'array'){
  for(obj in object){
    ...
  }
}

PS。 $（）返回$ -object，但不返回dom-element。

Javascript：函数仅适用于getElementById

2 个答案: