Webstorm常用快捷键备忘

「爱情、让人受尽委屈。」 2022-09-24 11:15 68阅读 0赞

1. ctrl + shift + n: 打开工程中的文件，目的是打开当前工程下任意目录的文件。  
2. ctrl + j: 输出模板  
3. ctrl + b: 跳到变量申明处  
4. ctrl + alt + T: 围绕包裹代码(包括zencoding的Wrap with Abbreviation)  
5. ctrl + \[\]: 匹配 \{\}\[\]  
6. ctrl + F12: 可以显示当前文件的结构  
7. ctrl + x: 剪切(删除)行，不选中，直接剪切整个行，如果选中部分内容则剪切选中的内容  
8. alt + left/right:标签切换  
9. ctrl + r: 替换  
10. ctrl + shift + up: 行移动  
11. shift + alt + up: 块移动(if()\{\},while()\{\}语句块的移动)  
12. ctrl + d: 行复制  
13. ctrl + shift + \]/\[: 选中块代码  
14. ctrl + / : 单行注释  
15. ctrl + shift + / : 块注释  
16. ctrl + shift + i : 显示当前CSS选择器或者JS函数的详细信息  
17. ctrl + '-/+': 可以折叠项目中的任何代码块，它不是选中折叠，而是自动识别折叠。  
18. ctrl + '.': 折叠选中的代码的代码。  
19. shift + esc: 当前激活的任意小窗口最小化，也可以是alt+数字键，数字在小窗口有显示。  
20. alt + '7': 显示当前的函数结构。  
21. 如果是\*.html页面，则在文件名下的导航栏某DOM结构上右键，可以全选当前DOM结构。

**常用快捷键—Webstorm入门指南**

提高代码编写效率，离不开快捷键的使用，Webstorm拥有丰富的代码快速编辑功能，你可以自由配置功能快捷键。

**windows下的设置方法**

快捷键配置  
点击“File”-> “settings”

Webstorm预置了其他编辑器的快捷键配置，可以点击

[![Webstorm常用快捷键备忘(Webstorm入门指南)][Webstorm_Webstorm]][Webstorm_Webstorm]

默认配置-Eclipse的常用快捷键对照表

### 查找/代替    ###

<table> 
 <tbody> 
  <tr> 
   <td><strong>Webstorm快捷键</strong></td> 
   <td><strong>Eclipse快捷键</strong></td> 
   <td><strong>说明</strong></td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+shift+N</strong></td> 
   <td><strong>ctrl+shift+R</strong></td> 
   <td>通过文件名快速查找工程内的文件（必记）</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+shift+alt+N</strong></td> 
   <td><strong>ctrl+shift+alt+N</strong></td> 
   <td>通过一个字符快速查找位置（必记）</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+F</strong></td> 
   <td><strong>ctrl+F</strong></td> 
   <td>在文件内快速查找代码</td> 
  </tr> 
  <tr> 
   <td><strong>F3</strong></td> 
   <td><strong>ctrl+K</strong></td> 
   <td>查找下一个</td> 
  </tr> 
  <tr> 
   <td><strong>shift+F3</strong></td> 
   <td><strong>ctrl+shift+K</strong></td> 
   <td>查找上一个</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+R</strong></td> 
   <td><strong>ctrl+F</strong></td> 
   <td>文件内代码替换</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+shift+R</strong></td> 
   <td>&nbsp;</td> 
   <td>指定目录内代码批量替换</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+shift+F</strong></td> 
   <td><strong>ctrl+H</strong></td> 
   <td>指定目录内代码批量查找</td> 
  </tr> 
 </tbody> 
</table>

**界面操作**

<table> 
 <tbody> 
  <tr> 
   <td><strong>Webstorm快捷键</strong></td> 
   <td><strong>Eclipse快捷键</strong></td> 
   <td><strong>说明</strong></td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+shift+A</strong></td> 
   <td><strong>ctrl+shift+A</strong></td> 
   <td>快速查找并使用编辑器所有功能（必记）</td> 
  </tr> 
  <tr> 
   <td><strong>alt+[0-9]</strong></td> 
   <td><strong>alt+[0-9]</strong></td> 
   <td>快速拆合功能界面模块</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+shift+F12</strong></td> 
   <td><strong>ctrl+shift+F12</strong></td> 
   <td>最大区域显示代码（会隐藏其他的功能界面模块）</td> 
  </tr> 
  <tr> 
   <td><strong>alt+shift+F</strong></td> 
   <td><strong>alt+shift+F</strong></td> 
   <td>将当前文件加入收藏夹</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+alt+s</strong></td> 
   <td><strong>ctrl+alt+s</strong></td> 
   <td>打开配置窗口</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+tab</strong></td> 
   <td><strong>ctrl+tab</strong></td> 
   <td>切换代码选项卡（还要进行此选择，效率差些）</td> 
  </tr> 
  <tr> 
   <td><strong>alt+</strong>←/→</td> 
   <td><strong>alt+</strong>←/→</td> 
   <td>切换代码选项卡</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+F4</strong></td> 
   <td><strong>ctrl+F4</strong></td> 
   <td>关闭当前代码选项卡</td> 
  </tr> 
 </tbody> 
</table>

**代码编辑**

<table> 
 <tbody> 
  <tr> 
   <td><strong>Webstorm快捷键</strong></td> 
   <td><strong>Eclipse快捷键</strong></td> 
   <td><strong>说明</strong></td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+D</strong></td> 
   <td><strong>ctrl+shift+</strong>↑</td> 
   <td>复制当前行</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+W</strong></td> 
   <td><strong>alt+shift+</strong>↑</td> 
   <td>选中单词</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+</strong>←/→<strong><br> </strong></td> 
   <td><strong>ctrl+</strong>←/→<strong><br> </strong></td> 
   <td>以单词作为边界跳光标位置</td> 
  </tr> 
  <tr> 
   <td><strong>alt+insert</strong></td> 
   <td><strong>alt+insert</strong></td> 
   <td>新建一个文件或其他</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+alt+L</strong></td> 
   <td><strong>ctrl+alt+L</strong></td> 
   <td>格式化代码</td> 
  </tr> 
  <tr> 
   <td><strong>shift+tab/tab</strong></td> 
   <td><strong>shift+tab/tab</strong></td> 
   <td>减少/扩大缩进（可以在代码中减少行缩进）</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+Y</strong></td> 
   <td><strong>ctrl+D</strong></td> 
   <td>删除一行</td> 
  </tr> 
  <tr> 
   <td><strong>shift+enter</strong></td> 
   <td><strong>shift+enter</strong></td> 
   <td>重新开始一行（无论光标在哪个位置）</td> 
  </tr> 
 </tbody> 
</table>

**导航**

<table> 
 <tbody> 
  <tr> 
   <td><strong>Webstorm快捷键</strong></td> 
   <td><strong>Eclipse快捷键</strong></td> 
   <td><strong>说明</strong></td> 
  </tr> 
  <tr> 
   <td><strong>esc</strong></td> 
   <td><strong>esc</strong></td> 
   <td>进入代码编辑区域</td> 
  </tr> 
  <tr> 
   <td><strong>alt+F1</strong></td> 
   <td><strong>alt+F1</strong></td> 
   <td>查找代码在其他界面模块的位置，颇为有用</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+G</strong></td> 
   <td><strong>ctrl+L</strong></td> 
   <td>到指定行的代码</td> 
  </tr> 
  <tr> 
   <td><strong>ctrl+]/[</strong></td> 
   <td><strong>ctrl+]/[</strong></td> 
   <td>光标到代码块的前面或后面</td> 
  </tr> 
  <tr> 
   <td><strong>alt+up/down</strong></td> 
   <td><strong>ctrl+shift+up/down</strong></td> 
   <td>上一个/下一个方法</td> 
  </tr> 
 </tbody> 
</table>

最后修改：2014.05.12

MAC苹果系统：

<table> 
 <tbody> 
  <tr> 
   <th>快捷键</th> 
   <th>作用</th> 
  </tr> 
  <tr> 
   <td>command + d</td> 
   <td>副本当前行或选中的区块</td> 
  </tr> 
  <tr> 
   <td>command + f</td> 
   <td>查找当前文档</td> 
  </tr> 
  <tr> 
   <td>command + g</td> 
   <td>跳转到文档的某一行某一列</td> 
  </tr> 
  <tr> 
   <td>command + p</td> 
   <td>显示参数信息</td> 
  </tr> 
  <tr> 
   <td>command + r</td> 
   <td>替换当前文档</td> 
  </tr> 
  <tr> 
   <td>command + w</td> 
   <td>选中当前单词、行、区块等</td> 
  </tr> 
  <tr> 
   <td>command + y</td> 
   <td>删除整行</td> 
  </tr> 
  <tr> 
   <td>command + mouseover</td> 
   <td>显示主要信息</td> 
  </tr> 
  <tr> 
   <td>command + [</td> 
   <td>移动光标到代码块前</td> 
  </tr> 
  <tr> 
   <td>command + ]</td> 
   <td>移动光标到代码块尾</td> 
  </tr> 
  <tr> 
   <td>command + +</td> 
   <td>折叠区块</td> 
  </tr> 
  <tr> 
   <td>command + -</td> 
   <td>展开区块</td> 
  </tr> 
  <tr> 
   <td>command + -&gt;</td> 
   <td>光标移到行尾</td> 
  </tr> 
  <tr> 
   <td>command + &lt;-</td> 
   <td>光标移到行头</td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <th>快捷键</th> 
   <th>作用</th> 
  </tr> 
  <tr> 
   <td>command + option + t</td> 
   <td>将代码以某种格式包括起来</td> 
  </tr> 
  <tr> 
   <td>command + option + l</td> 
   <td>将代码格式化</td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <th>快捷键</th> 
   <th>作用</th> 
  </tr> 
  <tr> 
   <td>command + shift + u</td> 
   <td>切换大小写</td> 
  </tr> 
  <tr> 
   <td>command + shift + [</td> 
   <td>选中到代码块前</td> 
  </tr> 
  <tr> 
   <td>command + shift + ]</td> 
   <td>选中到代码块尾</td> 
  </tr> 
  <tr> 
   <td>command + shift + +</td> 
   <td>折叠所有区块</td> 
  </tr> 
  <tr> 
   <td>command + shift + -</td> 
   <td>展开所有区块</td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <th>快捷键</th> 
   <th>作用</th> 
  </tr> 
  <tr> 
   <td>shift + return</td> 
   <td>在任意位置换行</td> 
  </tr> 
  <tr> 
   <td>shift + F6</td> 
   <td>高级修改，可快速修改光标所在的标签、变量、函数等</td> 
  </tr> 
  <tr> 
   <td>control + shift + f</td> 
   <td>find in path</td> 
  </tr> 
  <tr> 
   <td>control + shift + j</td> 
   <td>合并行</td> 
  </tr> 
  <tr> 
   <td>control + shift + r</td> 
   <td>replace in path</td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <th>快捷键</th> 
   <th>作用</th> 
  </tr> 
  <tr> 
   <td>option + delete</td> 
   <td>delete to word start</td> 
  </tr> 
  <tr> 
   <td>option + fn + delete</td> 
   <td>delete to word end</td> 
  </tr> 
  <tr> 
   <td>option + -&gt;</td> 
   <td>以单词为单位移动光标</td> 
  </tr> 
  <tr> 
   <td>option + &lt;-</td> 
   <td>以单词为单位移动光标</td> 
  </tr> 
 </tbody> 
</table>

[Webstorm_Webstorm]: https://fj.ikafan.com/pic/19/9d/199d8ae41a4b2a63fc7dfcd7c066685f.png