ie调试工具说明

最新推荐文章于 2024-04-29 15:31:08 发布

atq9

最新推荐文章于 2024-04-29 15:31:08 发布

阅读量1.5k

点赞数

分类专栏： WEB

WEB 专栏收录该内容

50 篇文章 0 订阅

订阅专栏

http://msdn.microsoft.com/zh-cn/library/ie/hh771812(v=vs.85).aspx

可以从“控制台”选项卡或“脚本”选项卡下的控制台窗格中查看 F12 工具控制台消息。

<!DOCTYPE html>
<input type="text" id="txtShow"/>
<script lanuage='javascript'>
if(window.console)
{
window.console.log("This is a logging message");
window.console.warn("This is a warning message");
window.console.error("This is an error message");
window.console.info("This is an info message");
window.console.log("this is a log");
oExample = document.getElementById("txtShow");
window.console.dir(oExample);
window.console.assert((1!=1), "assert message: x != null");
}
</script>

F12 工具可在行或语句级别调试 JavaScript，而不管代码是否按行或语句显示。那些大块的编写紧凑的代码仍可逐步执行。不过，如果将代码全部放在一个代码块中，则有时很难遵循逻辑。

若要设置脚本格式或“出色打印”脚本，请单击“配置”按钮 Gg699336.f12_configurationbutton(zh-cn,VS.85).png ，然后单击“格式化 JavaScript”。以下屏幕快照展示 JavaScript 代码块在格式化之前和之后的对比。

当代码执行在某个断点处停止时，可使用导航按钮来继续执行函数 (F5)、全部中断执行函数 (Ctrl+Shift+B) 或逐语句执行函数 (F11)、逐过程执行函数 (F10) 或跳出函数执行 (Shift+F11)。当在断点处暂停执行或正逐步执行时，调试窗口实际上是模式窗口。

查看调用堆栈

使用“调用堆栈”选项卡，可以查看从你的代码中调用函数时所采用的路径。这可帮助你作为 Bug 发现意外的代码路径。通过“调用堆栈”选项卡中，可双击任意函数，并转到源代码中相应的调用。

调试多个脚本

大型网页通常包含多个 JavaScript 文件。使用 F12 工具，可以在调试代码时对多个脚本文件进行操作。若要查看不同的文件，请单击“开始调试”按钮旁边的向下箭头，以显示与网页关联的脚本的列表。使用 F12 工具逐步执行代码时，F12 工具将遵循跨越多个文件的执行路径。你可添加变量以从任意脚本文件中进行监视，“调用堆栈”视图将显示跨不同脚本文件中所包含的函数的执行路径。

HTML”选项卡视图在由内存中的 Windows Internet Explorer 9 呈现的树视图中显示你的网页的动态标记。它反映打开 F12 时的 DOM，如果有任何更改，则需要刷新。你可以使用鼠标或键盘直接在树视图中导航，以及查看特性和更改值。

若要跳转到网页上的特定元素，请按 Ctrl+B，或单击“单击选择元素” “单击选择元素”按钮的图片按钮。在网页上，当你将鼠标悬停在元素上方时将突出显示相应的元素。单击某个元素时，将在 HTML 视图中突出显示 DOM 树中对应的节点。

分析脚本

要开始操作，请在 Internet Explorer 9 中打开你要分析的页面。在 Internet Explorer 9 中，按 F12 以打开 F12 工具，然后单击“探查器”选项卡。

探查器让你能够开始和停止分析，并提供了一些有关函数、函数的运行次数以及每个函数运行的时间的视图或报告。

当你第一次单击“探查器”选项卡时，网格是空的。单击“开始分析”按钮，然后运行你要在浏览器中分析的代码。如果你要从网页的初次加载开始，请单击“刷新”以运行页面上的代码。在需要停止收集数据并查看结果时，单击“停止分析”。要只分析某个代码部分，请单击“开始分析”，仅在浏览器中运行相应的代码部分（如从某个按钮单击调用的某个函数），然后单击“停止分析”。