非侵入式JavaScript混淆事件处理(Unobtrusive Javascript Obfusc

你知道我最喜欢约生硬的JavaScript？你总是知道它要干什么，当你触发一个事件。

<a onclick="thisHappens()" />

现在，每个人都在喝不显眼的库尔急救它不是那么明显。呼吁将事件绑定可以在任何数量的获得包括您的网页上的JavaScript文件的任何行发生。这可能不是一个问题，如果你是唯一的开发者，或者如果你的团队有某种约定的结合事件处理像往常一样使用CSS类的特定格式。在实际的工作中，这使得它很难理解你的代码。

DOM的浏览器如Firebug看起来他们可以帮助，但它仍然是耗时浏览所有元素的事件处理程序的属性，只是为了找到一个执行你正在寻找的代码。即使如此，它通常只是告诉你它是一个匿名函数（），没有行号。

我发现，用于发现什么，当事件被触发的JS代码被执行的方法是使用Safari浏览器的性能分析工具，它可以告诉你什么JS在一定时间内被执行，但有时可能很多JS打猎通过。

我们有了要找出当我点击一个元素发生了什么更快的方法。有人可以告诉我吗？

Answer 1:

如果你正在使用jQuery你可以把其先进的事件系统的优势，并检查连接的事件处理程序的函数体：

$('body').click(function(){ alert('test' )})

var foo = $('body').data('events');
// you can query $.data( object, 'events' ) and get an object back, then see what events are attached to it.

$.each( foo.click, function(i,o) {
    alert(i) // guid of the event
    alert(o) // the function definition of the event handler
});

或者你也可以实现自己的事件系统。

Answer 2:

退房视觉事件 ......这是你可以使用能公开页面对事件进行了书签。

Answer 3:

要回答你的问题，请尝试使用Firebug的命令行。这将让你使用JavaScript通过ID迅速抓住一个元素，然后通过它的听众迭代。通常情况下，如果用的console.log使用，你甚至能够获得函数定义。

现在，保卫不显眼：

我在不显眼的JavaScript找到好处是，它是一个容易得多，我看到它是什么的DOM。这么说，我觉得它一般不好的做法 ，创建匿名函数（只有少数例外）。（我发现使用jQuery的最大的错其实就是他们的文档中，匿名函数可以在虚空的世界里，失败不会导致有用的输出存在，但jQuery有使他们的标准。）我一般只使用匿名函数的政策如果我需要使用类似bindAsListener从原型。

此外，如果JS文件被正确地划分，他们将只处理一个子集一次DOM的。我有一个“有序的复选框”库，这是在其他项目然后把它重新使用只有一个JS文件。我也将一般都在给定的子库的方法，无论是作为JSON对象或类的成员方法，我有每个js文件一个对象/类（就如同我在做一个更正式的语言一切）。如果我有一个关于我的“表单验证码”的问题，我会看formValidation在formvalidation.js对象。

与此同时，我会同意，有时事情会变得迟钝这种方式，与他人打交道时更是如此。但混乱的代码是杂乱无章的代码，这是无法避免的，除非你是通过自己的工作，是一个优秀的程序员。

最后，虽然，我宁愿对付使用/* */注释掉大多数的两个或三个js文件发现行为不端的代码，然后经过HTML和删除的onclick属性。