如何找出将元素的可见性设置为隐藏的脚本？

Question

我正在处理一个包含许多不同脚本的复杂页面，一些ASP.NET AJAX和一些jQuery。

由于某些原因，当页面加载其中一个元素时，其可见性设置为隐藏。

那里有什么可以告诉我是什么导致这个元素不可见？或者甚至可以阻止在任何脚本中发生的事情的东西正在这样做，所以我可以看到它是什么？

Answer 1

使用DOM检查器（如Chrome中内置的检查器）首先确定是否由于CSS规则将其设置为隐藏，或者是通过直接内联样式设置以编程方式将其设置为隐藏。

如果它以编程方式设置为隐藏，那么我唯一知道的是搜索所有可能改变可见性的javascript代码。

然后，当您找到一些候选行代码时，请使用javascript调试器（我最喜欢的是Chrome内置的调试器）并在每行上设置断点。然后，在设置断点之后重新加载页面，并且当其中一个断点被命中时，您可以单步执行该部分代码并查看谁在执行此操作。此时，您甚至可以查看调用堆栈并查看调用此代码的代码，依此类推。或者，您可以逐步执行此代码，进入调用它的更高级别，并了解它们为什么这样做。

如果它是隐藏的CSS规则，那么你需要查看触发那些CSS规则（类，ID等等）的内容，并找出如何更改其中一个以便所需的对象没有被CSS规则隐藏。请记住，可以通过javascript从DOM中的对象添加/删除类，这也可能是原因的一部分。

Answer 2

使用Firebug，您可以在整个脚本中设置断点，并观察变量在不同点上的变化。在变量上设置监视并在脚本中设置断点以尝试确定何时设置它。祝你好运我在遇到这个问题之前就已经有了这个问题

Answer 3

您可以尝试调试..或者您可以使用以下内容覆盖它：

<强> CSS

#element, .elements{
    visibility: visible !important;
}

修改脚本可能会破坏其他内容。 有时在生产环境中，您不允许修改其他预先存在的脚本。 有时它不值得一直试图弄清楚它是什么剧本。特别是如果页面上有10-20个脚本可以随时更新或更改。