Unobtrusive Javascript混淆事件处理

你知道我最喜欢什么令人窒息的javascript吗？你总是知道当你触发一个事件时会做什么。Unobtrusive Javascript混淆事件处理

<a onclick="thisHappens()" />

既然每个人都喝不显眼的酷乐，那就不那么明显了。调用绑定事件可以发生在您的页面上包含的任意数量的JavaScript文件的任何行上。如果您是唯一的开发人员，或者您的团队对绑定事件处理程序有某种约定，例如始终使用特定格式的CSS类，则这可能不成问题。但在现实世界中，这使得很难理解你的代码。

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

我发现用于发现触发事件时JS代码执行的技巧是使用Safari的分析工具，它可以告诉你JS在特定时间段内执行的情况，但有时可能会有很多JS追捕。

有一定是找出当我点击一个元素发生了什么更快的方法。有人可以请赐我吗？

来源

2009-10-06 arkanciscan

对此也非常感兴趣。 :) – arno 2009-10-06 18:25:42

我发现这个问题http://stackoverflow.com/questions/446892/how-to-find-event-listeners-on-a-dom-node/447106#447106 – arkanciscan 2009-10-06 18:36:39

如果你使用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 
});

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

来源

2009-10-06 18:36:43

这很整齐。 – slikts 2009-10-06 18:38:52

称它是“库尔援助”似乎不公平。 DOM Level 2事件解决了内联事件处理的具体问题，例如总是产生冲突。我不回想写代码来使用window.onload必须检查是否有其他人之前分配过它，有时让它被偶然覆盖或出于潦草。它还确保更好地分离结构（HTML）和行为（JS）层。总而言之，这是一件好事。

关于调试，我不认为有任何的方式来解决事件处理程序是匿名函数，不是唠叨作者在可能情况下使用命名功能等。如果可以的话，告诉他们它会产生更有意义的调用堆栈，并使代码更易于维护。

来源

2009-10-06 18:30:25 slikts

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

来源

2009-10-06 19:25:52 Mottie

要回答你的问题，请尝试使用Firebug的命令行。这将使您可以使用JavaScript通过ID快速获取元素，然后遍历其侦听器。通常，如果与console.log一起使用，您甚至可以获取函数定义。

现在，保卫不显眼：

我在不显眼的JavaScript找到的好处是，它是一个容易得多，我看到它是什么的DOM。也就是说，我觉得通常是坏习惯创建匿名函数（只有少数例外）。（我在JQuery中遇到的最大错误实际上是在他们的文档中，匿名函数可能存在于一个下层世界，失败并不会导致有用的输出，但JQuery使它们成为标准。）如果我需要使用Prototype中的bindAsListener之类的东西，我通常只有使用匿名函数的策略。另外，如果JS文件被正确划分，它们将一次只处理DOM的一个子集。我有一个“有序的复选框”库，它在只有一个JS文件，然后在其他项目中重新使用。我通常也将给定子库的所有方法作为JSON对象或类的成员方法，并且每个js文件都有一个对象/类（就像我正在用更正式的语言）。如果我对“表单验证代码”有疑问，我将查看formvalidation.js中的formValidation对象。

同时，我会同意有时候事情会变得迟钝，特别是在与他人打交道的时候。但混乱的代码是混乱的代码，除非你自己工作，并且是一名优秀的程序员，否则无法避免。然而，最后，我宁愿处理使用/* */来评论大部分两三个js文件，以找出行为不当的代码，然后通过HTML并删除onclick属性。

来源

2009-10-06 19:31:12 cwallenpoole

有一件事：你不应该通过查看HTML代码能够看到在JavaScript中会发生什么。这是什么滋扰？ HTML是用于结构的。

如果你想检查什么事件绑定到某些元素，那么现在有一个名为visual event的书签，而萤火虫1.6（IIRC）将会有某种事件检查器。

来源

2009-10-06 20:30:47 wildcard

Unobtrusive Javascript混淆事件处理

回答

相关问题