有谁知道如何找到js文件的javascript操作?

时间:2014-11-12 02:08:03

标签: javascript debugging

例如:

文件a.html包含5个javascript文件。当我点击共享btn(<a href="" class="sns-share"></a>)时,我怎么知道我的点击操作来自哪个js文件。

1 个答案:

答案 0 :(得分:0)

我看到了几种可能的情况。我将介绍每种情况以及如何解决问题。

按钮绑定到javascript:

按钮的格式为<a href="javascript:..."></a>...是要调用的函数。为了使其正常工作,该函数的名称尚未被证实,即使文件的其余部分具有。在这种情况下,您应该能够在您喜欢的文本编辑器中打开10个文件中的每个文件,然后只搜索该函数名称。容易。

javascript绑定到按钮:

我认为这种情况最有可能是你给我们的一个小例子。这是按钮被赋予某个类(可能是sns-share?)的地方,并且javascript以某种方式在DOM中查找按钮并绑定到其click事件。

我会为此做的与上面类似,只需要几步。首先,通过&#34;美化器&#34;运行每个文件。 (http://jsbeautifier.org/就是一个例子)让它们更容易阅读。 这不会修复变量名称或类似的东西;它只会使结构更容易阅读。接下来,在您喜欢的文本编辑器中打开美化文件。搜索使用的类名(在您的情况下,可能是sns-share)。除非代码被故意混淆,否则类名称字符串应显示在某处。找到这个字符串,并智能地读取代码,找出它的使用位置。如果你能找到javascript找到该类的所有元素并将点击处理程序绑定到它们的位置,你就找到了你的函数。

实际绑定可能有几种不同的形式。也许:

$(".sns-share").click(function () ....

如果他们使用jQuery。或者也许:

var elements = jQuery(".sns-share");
elements.bind('click', function () ...

也许他们没有使用任何包装库并直接使用DOM:

var elements = document.getElementsByClassName('sns-share');
for (var i = 0; i < elements.length; i++) {
    element.onclick = function () ...
}

或者,如果他们想要兼容IE6,那就完全不同了。你需要留意正在发生的事情。

注意:

这些过程中的任何一个都取决于某些事情:

  1. 您愿意智能地阅读代码。你不能盲目地盯着它......你需要考虑它在做什么。

  2. 代码没有被故意混淆。如果是这种情况,那么您将很难找到正在发生的事情。在这种情况下,我只会重写整个程序。

  3. 另一个注意事项:

    如果是上面的第二种情况并且你很难找到一个地方开始寻找被绑定的实际功能,你可以检查Chrome中的元素(右键单击按钮,选择&#34; Inspect元素&#34;并查看事件监听器(它应该在左侧的面板中)。查找click事件并展开它。监听click事件的所有函数都将显示在那里。如果使用jQuery,这将赢得&由于可能很难找到由jQuery事件包装的函数,但是如果它们没有使用jQuery或其他东西并且直接绑定到DOM元素,则会有很大的帮助,这将完全指向将要执行的函数。