IE9中的F12开发人员工具未加载动态内容的样式选项卡信息

Question

我正在研究IE 7和8个HTML / CSS修复程序，但是当我使用开发人员工具并尝试查看动态加载的HTML时，你首先无法选择新添加的元素，但后来我读到你应该点击工具栏中的刷新工作。但是，当您检查任何元素时，样式选项卡中的样式信息无法正确显示。

它显示的内容如下： 继承 - html 继承 - 身体 inerhited - div inerhited - div inerhited - div

您无法展开这些以查看实际属性和值，就像使用未动态加载的元素一样。

有解决方法吗？

此致 雅克

Answer 1

有。

这是一个肮脏的解决方法，但应该允许您检查可能已动态添加到dom的元素。

请参阅下面的屏幕截图：

如果您无法选择元素（箭头按钮），请单击编辑按钮（使用铅笔），然后您将进入编辑模式。再次单击编辑以退出编辑模式，现在可以选择元素。

  

“编辑模式”

     

有时进入和退出编辑模式可能会产生副作用，但此技术适用于大多数情况。

Answer 2

我自己也遇到过这个问题。

我使用Head.js的扩展版本来加载样式表链接以及脚本文件。我现在有一个特定的IE8样式错误，我需要调查，但动态添加的样式不会出现在开发人员工具中。

要调试它，我想我将不得不暂时临时添加css文件。 Chrome和Firefox开发工具可以处理这种动态样式。如果我有通用的样式问题，这很好，但是当它具体是IE时，我必须跳过一些环节。

我想不出这个“解决方案”。不幸的是，我们受IE开发工具的支配。也许IE 10开发工具更好，但我现在在Windows 7上。

Answer 3

你试过FireBug lite吗？这是一个完全使用JavaScript编写的FireBug版本，它允许您使用大多数常用的firebug功能，但在IE中。它适用于IE 6及更高版本。

过去在iPad上调试时我已成功使用它，直到iOS 6，无法检查HTML。它在IE上同样有效。

您可以在此处详细了解：http://getfirebug.com/firebuglite