IE11 —— F12 开发者工具

F12 开发者工具简介
使用 F12 开发人员工具,你可以调试、测试网页并加快其速度 。无论你是需要微调你的 CSS 布局还是查找内存泄漏,你都能在此处找到帮助工具 。
如果你正在中查找“工具”菜单或工具栏,请尝试:
“中缺少菜单栏和工具栏 。”
如果你通过单击错误消息转至此处,并仅希望在以后避免错误消息,请尝试:
关于脚本错误应采取什么措施?
问题:我无法在的选项下关闭自动脚本调试程序 。
正在工作的F12工具
在 IE11 中,我们重头开始重建 F12 工具 。它们具有全新的 UI 和新功能性,可使你更快、更轻松地进行开发和调试 。
在键盘上按“F12”键以打开工具 。如果你的键盘没有功能键,则可以使用“工具”菜单 。
有八个不同工具,每个工具在 F12 工具界面中都带有其自己的选项卡 。你将在此处找到每个工具的图像、工具的作用和新增功能小结,以及该工具简化的几个典型开发或调试任务 。
DOM资源管理器工具(CTRL + 1)
DOM 资源管理器工具显示了在浏览器中渲染网页时网页的结构,并使在活动页中编辑 HTML 和样式的操作成为可能 。不必编辑或重新加载源,即可执行此操作,以便你可以快速解决显示问题或试用新思路 。
以下新功能包含在DOM 资源管理器工具中:
编辑 HTML 属性和 CSS 属性时,会提供自动完成建议 。
拖动 DOM 节点以将其重新排列 。
它简化的开发和调试任务:
确定不以正确位置或正确大小显示元素的原因 。
指出哪些 CSS 演示和媒体查询被应用于元素 。
测试元素的一系列不同颜色,以查看哪种颜色最佳 。
了解有关 DOM 资源管理器工具的详细信息 。
“控制台”工具(CTRL + 2)
“控制台”工具提供了与运行代码交互、使用控制台的命令行发送信息和使用控制台调试 API获取信息的方式 。“控制台”工具对开发人员而言非常有用,我们已使其更易于获得 。现在你可以使用 UI 右上角“帮助”按钮旁边的“控制台”按钮或按 CTRL + `在任何其他工具的底部打开它 。
以下新功能包含在“控制台”工具中:
使用“控制台”按钮或 CTRL + ` 在任何其他工具的底部打开控制台 。
用于计时、计数、编组等的新控制台调试 API方法 。
命令行上的自动完成建议可加快输入速度、减少拼写错误并帮助你发现API 的各个方面 。
它简化的开发和调试任务:
查看系统错误消息、异常警告和调试输出 。
使用新的计时方法将计时代码执行下拉至该语句 。
在不重新加载的情况下,更改运行代码中的变量值 。
了解有关“控制台”工具的详细信息 。
“调试程序”工具(CTRL + 3)
你可以使用“调试程序”工具检查代码的作用、代码执行时间及其执行方式 。在执行过程中暂停代码,逐行操作代码,然后查看每个步骤中变量和对象的状态 。
以下新功能包含在“调试程序”工具中:
无刷新调试 。设置断点,无需在运行时重新加载和丢失状态 。
用于更轻松管理多个脚本的选项卡式文档界面 。
突出显示断点和搜索匹配的滚动条 。
它简化的开发和调试任务:
使用调用栈查看导致函数调用的原因 。
使压缩或精简的代码更易于读取 。
监视 Web创建和执行 。
了解有关“调试程序”工具的详细信息 。
“网络”工具(CTRL + 4)
“网络”工具向你提供了涉及加载和网页操作的任何网络请求的详细信息 。
以下新功能包含在“网络”工具中:
改进的请求计时信息 。