Question

我想知道是否可以通过onclick函数找到一个元素？

例如：

<a class = "calculator" onclick = add(number1,number2);

<a class = "calculator" onclick = add(number2, number3);

我想获得第一个，唯一的区别是onclick功能，所以我认为这是我可以区别的方式。看起来像这样：

var elements = document.getElementsByClassName("calculator");

console.log(elements);

for (var i = 0; i <  elements .length; ++i) {
elementsSpecific = elements[i]. //The missing part

console.log(delementsSpecific);
 }

Answer 1

您可以使用

获取onclick功能

elements[i].getAttribute('onclick');

Answer 2

你可以，但我不推荐它。使用不同的ID更快。但是，如果你真的想这样做......

var link = document.querySelector('a[onclick="add(number1,number2)"]');

如果您不理解，请阅读querySelector

Answer 3

这是一种非常糟糕的定位元素的方法（如果onclick值会发生变化会怎么样？）但是如果它已经完成，那么你可以使用属性选择器和querySelector：

var el = document.querySelector('a[onclick="add(number1,number2);"]');

然而，在诉诸于此之前，我肯定会用尽其他选择途径。

Answer 4

不使用js框架并将其用于crossbrowser，你可以这样做。

var as = document.getElementsByClassName('calculator');
var element = null;
for (var x = 0; x < as.length; x++) {
  if (as[x].getAttribute('onclick') == 'add(number2,number3)') {
    element = as[x];
    break;
  }
}

http://jsbin.com/feyaheji/1/edit?html,console

Answer 5

document.querySelector是在DOM中寻找元素的圣杯：

HTML：

<a class = "calculator" onclick = "add(number1,number2);">First</>
<a class = "calculator" onclick = "add(number2, number3);">Second</>

JavaScript的：

var d2 = document.querySelector('.calculator[onclick*=number2][onclick*=number3]');
var d1 = document.querySelector('.calculator[onclick*=number1][onclick*=number2]');

console.log('Second', d2);
console.log('First', d1);

请注意[onclick*=number2]选择器匹配具有属性名称onclick的元素和包含number2的值

通过onclick函数查找元素？

5 个答案: