Chrome 开发者工具中的命令菜单
单
大家对命令菜单(Command Menu)应该都不陌生。目前主流的编辑器中都内置了对该功能的支持。在 Sublime Text 和 Visual Studio Code 中你都可以通过快捷键 Ctrl + Shift + P
呼出命令菜单(在 Mac 上是 Cmd + Shift + P
)。
在呼出的菜单中输入关键字选择自己需要的命令(支持模糊搜索哦),按回车即可执行命令。极大的提高了效率。
举个例子,以下的操作是为文件设置 JavaScript 的语法高亮:
很方便吧。
如果你已经习惯了这种操作方式,那么今天要告诉你一个好消息。Chrome 开发者工具现在也支持命令菜单了!激活的方式还是 Ctrl + Shift + P
。
激活后,长这个样子:
熟悉的配方,熟悉的味道。有木有!
滚动菜单,查看支持的命令,基本涵盖了我们日常开发用到的所有功能。
举几个实用的小例子吧(这些例子不同命令菜单一样可以实现,但命令菜单可以极大的提高效率)。
1. 搜索所有资源文件
激活命令菜单,输入 search
,选择 Search all files
,回车。在弹出的输入框中输入关键字就可以在所有页面引入的资源文件中搜索该关键字了。还支持正则表达式哦。
2. 禁用/开启页面 JavaScript
激活命令菜单,输入 js
,选择 Disable JavaScript
。再次选择,即可开启。
3. 隐藏 HTML 中的注释
激活命令菜单,输入 comment
,选择 Hide HTML Comments
。
更多快捷功能,自己去发现吧!
Chrome 开发者工具中的命令菜单的更多相关文章
- 【译】在 Chrome 开发者工具中调试 node.js
原文链接 : Debugging Node.js in Chrome DevTools 原文作者 : MATT DESLAURIERS 译文出自 : 掘金翻译计划 译文链接 : https://git ...
- 使用chrome开发者工具中的network面板测量网站网络性能
前面的话 Chrome 开发者工具是一套内置于Google Chrome中的Web开发和调试工具,可用来对网站进行迭代.调试和分析.使用 Network 面板测量网站网络性能.本文将详细介绍chrom ...
- 在 Chrome 开发者工具中调试 node.js
命令行工具 devtool ,它可以在 Chrome 的开发者工具中运行 Node.js 程序. 下面的记录显示了在一个 HTTP 服务器中设置断点的情况. 该工具基于 Electron 将 Node ...
- 在chrome开发者工具中观察函数调用栈、作用域链与闭包
在chrome开发者工具中观察函数调用栈.作用域链与闭包 在chrome的开发者工具中,通过断点调试,我们能够非常方便的一步一步的观察JavaScript的执行过程,直观感知函数调用栈,作用域链,变量 ...
- 在chrome开发者工具中观察函数调用栈、作用域链、闭包
在chrome的开发者工具中,通过断点调试,我们能够非常方便的一步一步的观察JavaScript的执行过程,直观感知函数调用栈,作用域链,变量对象,闭包,this等关键信息的变化.因此,断点调试对于快 ...
- 前端基础进阶(六):在chrome开发者工具中观察函数调用栈、作用域链与闭包
在前端开发中,有一个非常重要的技能,叫做断点调试. 在chrome的开发者工具中,通过断点调试,我们能够非常方便的一步一步的观察JavaScript的执行过程,直观感知函数调用栈,作用域链,变量对象, ...
- Chrome开发者工具中Elements(元素)断点的用途
SAP Engagement Center UI的这个按钮会每秒钟刷新一次,显示页面已经打开了多长时间. 需求:需要找到哪行JavaScript代码不断刷新的按钮文字. 按照经验判断,这个文字肯定是一 ...
- 使用chrome开发者工具中的performance面板解决性能瓶颈
前面的话 使用Chrome DevTools的performance面板可以记录和分析页面在运行时的所有活动.本文将详细介绍如何使用performance面板解决性能瓶颈 准备 [匿名模式] 匿名模式 ...
- Chrome开发者工具 debug 调试
Chrome 的开发者工具分为 8 个大模块,每个模块及其主要功能为: Element 标签页: 用于查看和编辑当前页面中的 HTML 和 CSS 元素. Network 标签页:用于查看 HTTP ...
随机推荐
- PyTorch学习系列(九)——参数_初始化
from:http://blog.csdn.net/VictoriaW/article/details/72872036 之前我学习了神经网络中权值初始化的方法 那么如何在pytorch里实现呢. P ...
- Linux内核源码分析--内核启动之(4)Image内核启动(setup_arch函数)(Linux-3.0 ARMv7)【转】
原文地址:Linux内核源码分析--内核启动之(4)Image内核启动(setup_arch函数)(Linux-3.0 ARMv7) 作者:tekkamanninja 转自:http://blog.c ...
- C# wpf 阻止*和|的输入
private void texBox_KeyDown(object sender, KeyEventArgs e) { if (Keyboard.Modifiers == ModifierKeys. ...
- KnockoutJs学习笔记(六)
这篇文章主要涉及control flow部分的binding. foreach binding主要作用于lists或是tables内数据单元的动态绑定.下面是一个简单的例子: js部分: ko.app ...
- Linux系统运维笔记(五),CentOS 6.4安装java程序
Linux系统运维笔记(五),CentOS 6.4安装java程序 用eclipse编译通的java程序,现需要实施到服务器.实施步骤: 一,导出程序成jar包. 1,在主类编辑界面点右健,选 ru ...
- 图学ES6-2.let与const命令
- python django查询一周,一月,一年时间
首先是当前时间的确定,对于年月日,orm模型都有对应的方法直接查询,周是没有方法直接查询的,我是没有找到这个方法,只能间接的查询 1 2 3 now_time = datetime.datetime. ...
- 高能天气——团队Scrum冲刺阶段-Day 6
高能天气--团队Scrum冲刺阶段-Day 6 今日完成任务 于欣月:完善计步器功能:实现了历史步数统计和设置锻炼计划功能,并实现可视化图形界面 余坤澎:将闹钟部分和小游戏部分进行了合并 康皓越:配合 ...
- 利用在线HTTP接口测试工具ApiPost,模拟移动端请求API接口
我们做开发一般都是在PC端,然而我们很多时候需要模拟移动端进行接口请求. 比如,当一个API需要根据用户不同的终端来返回不同的数据时,就需要一个工具来模拟不同的终端了. 利用接口测试工具ApiPost ...
- html (第四本书第九章参考)
上机1 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8 ...