如何处理类中的所有链接?

时间:2013-04-05 15:56:02

标签: javascript dom

我知道如何处理带有id的链接:

var a = document.getElementById("mylink");
a.onclick = function() {
  alert("ok");
};

但如果我在一个类 .lotsOfLinks 中有3个链接,我想要 就像我对Id一样处理每一个。

什么是最好和最短的方式?

谢谢。

5 个答案:

答案 0 :(得分:4)

这样做:

var elements = document.getElementsByClassName("lotsOfLinks");
for (var i = 0; i < elements.length; i++) {
    elements[i].onclick = function() {
        alert("ok");
    };
}

答案 1 :(得分:1)

// use querySelectorAll for greater browser compatibility
var a = document.querySelectorAll(".mylink");

// make your handler
var handler = function() {
  alert("ok");
};

// iterate the collection, and assign the handler
for (var i = 0; i < a.length; i++) {
    a[i].onclick = handler;
}

请注意querySelectorAll在IE6 / 7中不起作用,但我想你现在还不支持这些JavaScript环境。

答案 2 :(得分:0)

var a = document.getElementsByTagName('a');
for (var i = 0; i < a.length; i++){
    if (a[i].className == "lotsOfLinks"){
        a[i].onclick = function(){ alert("ok"); }
    }
}

答案 3 :(得分:0)

您可以尝试使用document.getElementsByClassName('myClass');,但在没有填充的9之前的IE版本中不支持

http://caniuse.com/getelementsbyclassname

答案 4 :(得分:0)

  var elements = document.getElementsByClassName("lotsOfLinks");
  for(var i = 0; i < elements.length; i++) {
     elements[i].addEventListener("click", function() {
         alert("ok");
     }
  }

使用了addEventListener()函数。