Question

我正在寻找一种方法来列出页面上有onclick事件的所有元素。

Answer 1

编辑回答进一步的问题......

我不确定你究竟在问什么，但我怀疑你正在寻找一种方法来查看元素的onclick事件是否附有代码？如果是这样，试试这个：

var allElements = document.getElementsByTagName('*');
for ( var i = 0; i<allElements.length; i++ ) {
    if ( allElements[i].className !== 'theClassNameYoureLookingFor' ) {
        continue;
    }
    if ( typeof allElements[i].onclick === 'function' ) {
        // do something with the element here
        console.log( allElements[i] );
    }
}

如果你想了解onclick事件附带的实际函数的一些信息，你需要使用Firebug或类似的东西输出函数并检查它，因为它可能在运行时生成（即函数声明可能不仅仅位于理论上可以轻松访问的页面上。尝试使用上面提供的代码，而不是

console.log（allElements [i]）;

做

console.log（allElements [i] .onclick）;

现在，在firebug中，您可以将鼠标悬停在打印的功能上并查看其代码。

Answer 2

如果您使用jQuery＆gt; = 1.4，您可以通过编写oneliner来获取具有onclick属性的所有元素的数组：

$('body *').toArray().filter(function(el) { return $(el).attr('onclick') });

Answer 3

我需要得到......每个onclick中的参数

您可以使用以下方法读取onclick属性的字符串值：

var onclickstr= allElements[i].getAttributeNode('onclick').value;

在Josh的代码中（这是一个稍微迂回的方法，IE所需）。

当然，它仅适用于从内联事件处理程序属性附加的事件处理程序，未通过JavaScript分配给onclick属性或通过addEventListener或attachEvent添加。

尝试从JavaScript代码字符串中获取值是一个丑陋且不可靠的黑客，除非没有其他选择，否则不应该使用它。如果页面是您自己生成的内容，则应使用不显眼的脚本技术。完全省略内联事件处理程序属性（如onclick）（今天它们被认为是不好的做法）并使用JavaScript本身附加处理程序，使用存储在更易于访问的地方（如classname和必要的其他“备用”属性）中的参数。 / p>

Answer 4

来自@Josh的回答货物对我不起作用，我不得不稍微修改它。

var allElements = document.getElementsByTagName('*');
for (var i = 0; i < allElements.length; i++) {
    if ($._data(allElements[i])['events'] != undefined 
        && $._data(allElements[i])['events']['click'] != undefined) {
        console.log(allElements[i]);
        for (var ii = 0; ii < $._data(allElements[i])['events']['click'].length; ii++) {
            console.log($._data(allElements[i])['events']['click'][ii].handler);
        }
    }
}

Answer 5

如果使用传统/旧式的事件处理程序附件方法（以下代码未经测试），这相当容易。

var getEventHandlers = function(nodes, eventType) {
    var handlers = [], h;

    for ( var i=0, l=nodes.length; i<l; i++ ) {
        h = nodes[i].getAttribute(eventType);
        if ( typeof h === "function" ) {
            handlers.push(h);
        }
    }

    return handlers;
};

使用：

console.log(getEventHandlers($("*"), "onclick"));
console.log(getEventHandlers($(".some-class"), "onclick"));

Answer 6

对于简洁的jquery选择器，您可以使用$('[onclick]')，但只能获得具有onclick 属性设置的元素。

通过onclick获取所有元素？

6 个答案: