chrome开发工具指南(十一)
检查资源
- 使用 Application 面板的 Frames 窗格可以按框架组织资源。
- 您也可以在 Sources 面板中停用 Group by folder 选项,按框架查看资源。
- 要按网域和文件夹查看资源,请使用 Sources 面板。
- 在 Network 面板中按名称或其他条件过滤资源。
按框架组织资源
使用 Application 面板的 Frames 窗格可以按框架组织页面的资源。
- 顶层(上面屏幕截图中的
top
)是主文档。 在这下方(例如上面屏幕截图中的
widget2
)是主文档的子框架。 展开一个子框架可以查看源自该框架的资源。子框架下方是图像、脚本,以及主文档的其他资源。
最后是主文档本身。
点击资源可以查看其预览。
右键点击资源可以在 Network 面板中查看、将其在新标签中打开、复制其网址或将其保存。
通过在 Sources 面板中点击导航器中的溢出菜单并停用 Group by folder 选项以停止按文件夹分组资源,您也可以按框架查看资源。
资源将仅按框架列示。
按网域和文件夹组织资源
要查看按网域和目录组织的资源,请使用 Sources 面板。
按名称、类型或其他条件过滤资源
使用 Network 面板可以按名称、类型和一系列其他条件过滤资源。 参阅下面的指南了解详情。
chrome开发工具指南(十一)的更多相关文章
- Chrome 开发工具指南
Chrome 开发工具指南 谷歌 Chrome 开发工具,是基于谷歌浏览器内含的一套网页制作和调试工具.开发者工具允许网页开发者深入浏览器和网页应用程序的内部.该工具可以有效地追踪布局问题,设置 Ja ...
- chrome开发工具指南(一)
注意:如果你是一个网页开发者同时想要获得最新版本的开发工具,那么你应该使用谷歌浏览器(金丝雀)Canary 版. Chrome 开发者工具 打开Chrome 开发者工具 选择浏览器位于浏览器窗口右上方 ...
- chrome开发工具指南(二)
Application 面板 使用 App Manifest 窗格检查您的网络应用清单和触发 Add to Homescreen 事件. 使用 Service Worker 窗格执行与服务工作线程相关 ...
- chrome开发工具指南(十四)
模拟和测试其他浏览器 您的任务不只局限于确保网站在 Chrome 和 Android 上出色运行.即使 Device Mode 可以模拟 iPhone 等多种其他设备,我们仍鼓励您查看其他浏览器模拟解 ...
- chrome开发工具指南(十二)
使用 Device Mode 模拟移动设备 使用 Chrome DevTools 的 Device Mode 打造移动设备优先的完全自适应式网站.了解如何使用 Device Mode 模拟多种设备及其 ...
- chrome开发工具指南(七)
检查动画 使用 Chrome DevTools 动画检查器检查和修改动画. 通过打开动画检查器捕捉动画.检查器会自动检测动画并将它们分类为多个组. 通过慢速播放.重播或查看动画源代码来检查动画. 通过 ...
- chrome开发工具指南(六)
检查和编辑页面与样式 使用 Chrome DevTools 的 Elements 面板检查和实时编辑页面的 HTML 与 CSS. 在 Elements 面板中检查和实时编辑 DOM 树中的任何元素. ...
- chrome开发工具指南(十三)
模拟传感器:地理定位与加速度计 由于大多数桌面设备都没有 GPS 芯片和加速度计,所以测试它们比较困难.Chrome DevTools 的 Sensors 模拟窗格可以通过模拟常见的移动设备传感器来降 ...
- chrome开发工具指南(九)
检查和管理存储.数据库与缓存 查看和修改本地存储与会话存储. 检查和修改 IndexedDB 数据库. 对 Web SQL 数据库执行语句. 查看应用缓存和服务工作线程缓存. 点击一次按钮即可清除所有 ...
随机推荐
- 关于JavaScript组件化的探索
Loaders 先放出项目地址:https://github.com/j20041426/Loaders 这是一个可以动态选择加载动画的样式和颜色的插件.这个项目仅仅是作为对js组件化的一个探索,不太 ...
- 基于Python使用SVM识别简单的字符验证码的完整代码开源分享
关键字:Python,SVM,字符验证码,机器学习,验证码识别 1 概述 基于Python使用SVM识别简单的验证字符串的完整代码开源分享. 因为目前有了更厉害的新技术来解决这类问题了,但是本文作 ...
- 教你上传本地代码到github
最近想起学Git,并且注册了Github. 将新创建的本地代码上传到github上,这里简单的记录一下,我喜欢使用命令行,这里全用命令行来实现,不了解Git命令的可以去了解下. 第一步:建立git仓库 ...
- 最大流当前弧优化Dinic模板
最大流模板: 普通最大流 无向图限制:将无向图的边拆成2条方向相反的边 无源汇点有最小流限制的最大流:理解为水管流量形成循环,每根水管有流量限制,并且流入量等于流出量 有源汇点的最小流限制的最大流 顶 ...
- 种下一棵树:有旋Treap
第一个平衡树板子,有旋Treap.用随机函数规定一个堆,维护点权的同时维护堆的性质,可以有效地避免退化成链.按我的理解,建立一棵二叉排序树,树的形态会和给出节点的顺序有关.按照出题人很机智定理,数据肯 ...
- python3.6成功安装scrapy
本文基于环境:win10(64)+python3.6(64) 第一次直接pip install scrapy,安装出错,错误提示 error: Microsoft Visual C++ 14.0 is ...
- 一步一步学Vue(十二)
为了提升代码的逼格,之后代码改为Vue文件组件,之前代码虽然读起来容易理解,而且适合在小的项目中使用,但是有如下缺点: 全局定义(Global definitions) 强制要求每个 componen ...
- javaScript获取url问号后面的参数
javaScript获取url问号后面的参数方法 function GetRequest() { var url = location.search; //获取url中"?"符后的 ...
- ABP:在多语句事务内不允许使用 CREATE DATABASE 语句
一.问题 使用ef codefirst开发,无法创建数据库的问题,如下提示 Server Error in '/' Application. 在多语句事务内不允许使用 CREATE DATABASE ...
- akoj-1076-Encoding
Encoding Time Limit:1000MS Memory Limit:65536K Total Submit:62 Accepted:35 Description Given a stri ...