IE11 —— F12 开发者工具( 二 ) _调试

改进的压缩信息捕获。
它简化的开发和调试任务：
查看页面跨资源消耗的带宽量。
通过查看请求和响应标头及正文调试 AJAX 请求。
标识减慢网页加载速度的网络请求。
了解有关“网络”工具的详细信息。
“UI响应能力”工具(CTRL + 5)
“UI 响应能力”工具可帮助你在页面速度减慢时了解出了什么问题。使用它分析速度缓慢的特定点可显示导致这些问题的操作。
UI 响应能力工具在 IE11 中是 F12 工具的新增工具。某些有趣的功能如下：
标识导致 UI 缓慢的 CPU 活动的不同源。
洞察网页的帧率。
在时间线上设置标签以隔离用户方案。
它简化的开发和调试任务：
测试代码优化。
加快你的网页速度。
了解有关“UI 响应能力”工具的详细信息。
“探查器”工具(CTRL + 6)
“探查器”工具是速度的单纯计量工具，向你显示了在分析会话过程中调用的函数、调用次数以及完成所需的时间。
以下新功能包含在“探查器”工具中：
跟踪在 Web中执行了哪些函数。
更干净、更快的响应 UI 。
它简化的开发和调试任务：
隔离代码中最慢的部分。
测试代码优化。
加快你的网页速度
了解有关“探查器”工具的详细信息。
“内存”工具(CTRL + 7)
如果某个网页开始很快，但使用一会后就变慢，主要原因通常是内存泄漏。“内存”工具跟踪网页的内存使用情况，帮助你标识何处的内存使用处于增长趋势、增长原因以及如何修复它。
“内存”工具在 IE11 中是 F12 工具的新增工具。某些有趣的功能如下：
使用时间线可以查看内存使用的进度更改。
使用快照可以在特定点检查内存使用的详细信息。
使用快照比较可以标识特定增长点。
它简化的开发和调试任务：
标识断开的 DOM 节点。
标识内存增长点。
计量对象的内存使用情况。
了解有关“内存”工具的详细信息。
“模拟”工具(CTRL + 8)
“模拟”工具可帮助你测试你的网页在不同屏幕大小和硬件功能上的运行方式，以及它们如何响应不同的用户代理字符串。
“模拟”工具在 IE11 中是 F12 工具的新增工具。某些有趣的功能如下：
你可以模拟不同的屏幕大小和分辨率。
GPS 模拟。
它简化的开发和调试任务：
在多个屏幕类型上测试响应设计。
对移动站点测试位置感知功能。
了解有关“模拟”工具的详细信息。
DOM资源管理器
使用“DOM 资源管理器”工具查看网页的 DOM（文档对象模型）状态、检查 HTML 结构和 CSS 样式，并测试更改以解决显示问题。
进入 DOM
HTML 和 CSS 文件是浏览器用于构建 DOM（文档对象模型）的蓝图，它将使用该蓝图呈现网页。“DOM 资源管理器”工具将向你显示网页的集成结构，并允许你无需编辑页面的源文件，即可更改样式、移动 HTML 元素，以及更改元素属性。
这可以在元素位置错误或行为异常时帮助你诊断问题，然后解决问题。
元素窗格
选择元素
编辑元素
移动元素
样式窗格
样式
跟踪
已计算
布局
事件
元素窗格
左侧的元素窗格实时显示当前创建的 DOM 。使用你的鼠标浏览它，单击父元素旁的箭头将其展开，并查看其子元素。你也可以使用键盘上的箭头键浏览它，使用向左键和向右键以展开和折叠元素。
选择元素
可以使用四种方法选择要检查的元素：