如何判断哪个javascript脚本为我的源代码添加了特定的类

Question

假设我的源HTML看起来像这样：

<div id="whatever" class="random-class">...</div>

但是我的Chrome检查员会向我显示：

{{1}}

我可以假设.random-class是由Javascript脚本添加的，但网站上有很多这样的脚本。是否有任何“标准”方式，例如，使用Chrome或FireBug检查器来确定哪个脚本将此类添加到我的元素中？

Answer 1

使用chrome中的webkit检查器，您可以使用Ctrl-Shift-F并搜索＆＃34; random-class＆＃34;。它将为您提供所有匹配项，区别于文件。

您可以逐个查看结果并查找原因，甚至可以设置断点。如果这太痛苦，您可以尝试查找$ sudo apt-get update 或jQuery className += "random-class"等。

如果您正在查看缩小代码的结果，则chrome允许您对结果进行美化，之后您可以重新搜索。 因此，如果您有1行addClass("random-class")的缩小文件，则匹配将显示1行。然后美化代码并重新搜索。现在结果将显示在两个不同的行中。

Answer 2

如果您要使用浏览器路线，像FireBug这样的浏览器扩展程序会向您显示附加到该元素的事件，例如＆＃39; change（）＆＃39;但是，请注意，某些嵌入式脚本不会显示在此处。我假设这些都是外部脚本。

您也可以使用SpryMedia的Visual Event。但是，如果您需要为一个大型网站执行此操作，这是一项繁重的工作。它还带有浏览器扩展名。