• Chrome 开发者工具(DevTools)中所有快捷方式列表（已整理）

    Chrome 开发者工具(DevTools)中所有快捷方式列表（已整理）

    前言

    Chrome DevTools提供了一些内置的快捷键，开发者利用这些快捷键可以节省常工作中很多日的开发时间。下面列出了每个快捷键在Windows/Linux及Mac中的对应键。其中一些快捷键对于DevTools全局可用，而另一些则只能在单个面板中使用。

    具体介绍

    打开DevTools

    你可以通过以下任何一种方式来访问DevTools：
    • 打开浏览器右上角的Chrome菜单chrome-menu，然后选择“更多工具”–“开发者工具”。
    • 在页面任何元素处点击右键，然后选择“审查元素”。

    		Windows / LinuxMac
    打开开发者工具F12,Ctrl+Shift+ICmd+Opt+I
    切换审查元素模式与浏览器窗口模式Ctrl+Shift+CCmd+Shift+C
    打开开发者工具并定位到控制台Ctrl+Shift+JCmd+Opt+J
    Inspect the Inspector (undock first one and press)Ctrl+Shift+ICmd+Opt+I

    所有面板


    		Windows / LinuxMac
    显示设置对话框?,F1?
    下一个面板Ctrl+]Cmd+]
    上一个面板Ctrl+[Cmd+[
    最后一个面板Ctrl+Alt+[Cmd+Opt+[
    第一个面板Ctrl+Alt+]Cmd+Opt+]
    更改停靠位置(测试发现与添加书签冲突)Ctrl+Shift+DCmd+Shift+D
    打开设备(Device)模式Ctrl+Shift+MCmd+Shift+M
    切换控制台 / 关闭设置对话框EscEsc
    刷新页面F5,Ctrl+RCmd+R
    刷新页面(忽略缓存内容)Ctrl+F5,Ctrl+Shift+RCmd+Shift+R
    当前文件或面板查找Ctrl+FCmd+F
    所有资源中进行查找Ctrl+Shift+FCmd+Opt+F
    按文件名查找 (排除Timeline面板)Ctrl+O,Ctrl+OCmd+O,Cmd+O
    放大 (当DevTools获得焦点时)Ctrl++Shift++
    缩小Ctrl+-Shift+-
    恢复默认文字大小Ctrl+0Shift+0

    Elements面板


    		Windows / LinuxMac
    撤销更改Ctrl+ZCmd+Z
    重做Ctrl+YCmd+Y,Cmd+Shift+Z
    导航Up,DownUp,Down
    展开/折叠节点Right,LeftRight,Left
    展开节点Single-click on arrowSingle-click on arrow
    展开/折叠节点及其子元素Ctrl+Alt+Click on arrow iconOpt+Click on arrow icon
    编辑属性Enter,Double-click on attributeEnter,Double-click on attribute
    隐藏元素HH
    切换编辑HTMLF2
    右键点击元素你可以：
    • 更改元素状态(:active,:hover,:focus,:visited)；
    • 元素上设置断点(更改子元素、更改属性及删除节点)；
    • 清空控制台

    样式侧边栏(Style Sidebar)


    		Windows / LinuxMac
    编辑规则Single-clickSingle-click
    插入新属性Single-click on whitespaceSingle-click on whitespace
    定位到样式属性定义处Ctrl+Click on propertyCmd+Click on property
    定位到属性值定义处Ctrl+Click on property valueCmd+Click on property value
    循环颜色值(rgba,hsl等)Shift+Click on color picker boxShift+Click on color picker box
    编辑上/下一个属性Tab,Shift+TabTab,Shift+Tab
    增加/减小值Up,DownUp,Down
    每次以10增加/减小值Shift+Up,Shift+DownShift+Up,Shift+Down
    每次以10增加/减小值PgUp,PgDownPgUp,PgDown
    每次以100增加/减小值Shift+PgUp,Shift+PgDownShift+PgUp,Shift+PgDown
    每次以0.1增加/减小值Alt+Up,Alt+DownOpt+Up,Opt+Down
    attributes-icon模仿元素伪状态(:active,:hover,:focus,:visited)
    plus添加新的样式选择器

    Sources 面板


    		Windows / LinuxMac
    暂停/恢复脚本运行F8,Ctrl+F8,Cmd+
    Step over next function callF10,Ctrl+'F10,Cmd+'
    Step into next function callF11,Ctrl+;F11,Cmd+;
    Step out of current functionShift+F11,Ctrl+Shift+;Shift+F11,Cmd+Shift+;
    Select next call frameCtrl+.Opt+.
    Select previous call frameCtrl+,Opt+,
    Toggle breakpoint conditionClick on line number,Ctrl+BClick on line number,Cmd+B
    Edit breakpoint conditionRight-click on line numberRight-click on line number
    Delete individual wordsAlt+DeleteOpt+Delete
    Comment a line or selected textCtrl+/Cmd+/
    Save changes to local modificationsCtrl+SCmd+S
    Save all changesCtrl+Alt+SCmd+Opt+S
    Go to lineCtrl+GCtrl+G
    Search by filenameCtrl+OCmd+O
    Jump to line numberCtrl+P+:<number>Cmd+P+:<number>
    Jump to columnCtrl+O+:<number>+:<number>Cmd+O+:<number>+:<number>
    Go to memberCtrl+Shift+OCmd+Shift+O
    Close active tabAlt+WOpt+W
    Run snippetCtrl+EnterCmd+Enter
    pause-grayDon’t pause on exceptions
    pause-bluePause on All exceptions (including those caught within try/catch blocks)
    pause-purplePause on uncaught exceptions (usually the one you want)

    代码编辑快捷键


    		Windows / LinuxMac
    跳转到匹配位置Ctrl+M
    跳转到指定行Ctrl+P+:<number>Cmd+P+:<number>
    跳转到指定列Ctrl+O+:<number>+:<number>Cmd+O+:<number>+:<number>
    切换注释Ctrl+/Cmd+/
    选择下一个出现位置Ctrl+DCmd+D
    撤销上一次操作Ctrl+UCmd+U

    TimeLine 面板


    		Windows / LinuxMac
    启动/停止记录Ctrl+ECmd+E
    保存timeline数据Ctrl+SCmd+S
    加载timeline数据Ctrl+OCmd+O

    Profiles 面板


    		Windows / LinuxMac
    启动/停止记录Ctrl+ECmd+E

    Console 控制台


    		Windows / LinuxMac
    Accept suggestionRightRight
    上一个命令/行UpUp
    下一条命令/行DownDown
    控制台获取焦点Ctrl+ Ctrl+
    清空控制台Ctrl+LCmd+K,Opt+L
    多行输入Shift+EnterCtrl+Return
    执行EnterReturn
    右键点击控制台：
    • XMLHttpRequest记录：打开查看XHR的日志
    • 导航处切换保存日志
    • 过滤：隐藏与显示脚本文件的信息
    • 清空控制台：清空控制台所有信息

    Screencasting


    		Windows / LinuxMac
    Pinch zoom in and outAlt+Scroll,Ctrl+Click and drag with two fingersOpt+Scroll,Cmd+Click and drag with two fingers
    Inspect element toolCtrl+Shift+CCmd+Shift+C

    Emulation


    		Windows / LinuxMac
    Pinch zoom in and outShift+ScrollShift+Scroll

    其他Chrome快捷方式

    下面是一些浏览器中非常有用的额外的快捷方式(附：所有Windows/Linux/Mac快捷方式)

    		Windows / LinuxMac
    查找下一个Ctrl+GCmd+G
    查找上一个Ctrl+Shift+GCmd+Shift+G
    打开一个隐身模式的新窗口Ctrl+Shift+NCmd+Shift+N
    切换是否显示书签栏Ctrl+Shift+BCmd+Shift+B
    打开历史记录页面Ctrl+HCmd+Y
    打开下载记录页面Ctrl+JCmd+Shift+J
    打开浏览器任务管理器Shift+ESCShift+ESC
    标签页历史下一页Alt+RightOpt+Right
    标签页历史上一页Backspace,Alt+LeftBackspace,Opt+Left
    选中地址栏F6,Ctrl+L,Alt+DCmd+L,Opt+D
    地址栏放置一个?供你输入内容进行搜索(使用你设置的默认搜索引擎)


    **
  • 相关阅读:
    Java Bean、POJO、 Entity、 VO 、PO、DAO
    javadoc生成出现错误“编码 GBK 的不可映射字符”
    MySQL 查询所有子级函数
    mybatis配置自带缓存和第三方缓存
    通过js调用android原生方法
    window10上登录Oracle时提示ORA-12546:Permission denied
    大表的主键创建优化技术(转一篇有深度的文章)
    Oracle并行执行特性应用初探
    【腾讯大学】服务商工具+服务平台 小结
    【腾讯大学】猫眼：产品核心能力--产品决策力 小结
  • 原文地址：https://www.cnblogs.com/moyuling/p/8965758.html
Copyright © 2020-2023  润新知