webstorm常用功能快捷方式

1 自动注释和撤销注释:ctrl+/

在一句代码前面用 ctrl+/ 可以自动注释和撤销注释,js,html都可以,很好的省去了敲注释符的时间  (mac下为command+/,下同)

2 自动补全html标签

我们知道在使用Linux命令的时候按tab键有自动补全的功能,在很多编译器里也是,在webstorm中当你想敲一些html元素时,比如:

(1)想敲一对h1标签,只需要敲h1,按tab键,变回自动补全为:

<h1></h1>
  • 1
  • 1

(2)想输入带id的,如

<div id="abc"></div>
  • 1
  • 1

只需要输入:div#abc,按Tab键,便会自动补全。

(3)想输入带class的,如

<div class="abc"></div>
  • 1
  • 1

只需要输入:div.abc,按Tab键,便会自动补全。

(4)想输入一个div里有6个p标签,只需要输入:  div>p*6 ,按Tab键,便会自动补全为:

<div>
        <p></p>

        <p></p>

        <p></p>

        <p></p>

        <p></p>

        <p></p>
</div>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13

(5)特定属性的标签的补全:

a[href=#]
  • 1
  • 1

tab后:

<a href="#"></a>
  • 1
  • 1

再如:

ul.menu>li*6>a[href=#]{HTML}
  • 1
  • 1

tab后补全为:

<ul class="menu">
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
    <li><a href="#">HTML</a></li>
</ul>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9

更多代码简写补全的技巧可以参考:  http://blog.wpjam.com/m/emmet-grammar/ http://www.w3cplus.com/tools/emmet-cheat-sheet.html http://www.ruanyifeng.com/blog/2013/06/emmet_and_haml.html

3 自动整理代码格式进行对齐

选中要整理的代码

windows:

CTRL+ALT+L
  • 1
  • 1

Mac

command+option+L
  • 1
  • 1

4 寻找代码片段

有时候我们需要寻找一些特定的样式或函数,只需要右键要寻找的目录,选择 find in path,输入要寻找的内容,webstorm就会自动寻找所有包含该内容的文件了。

5 寻找代码定义位置

很多时候我们想查找某个函数或者变量定位的位置,按住command(ctrl)键,点击要查找的内容,webstorm就会自动跳转到它定义的地方了,这个方法能够很好的提高开发和阅读代码的效率。

6 大小写转化

有时候需要快速的把一段字母转成全大写或全小写,只需要使用:

Command(ctrl)+shift+U

7 全局查找

双击 shift

8 查找最近打开的文件

Ctrl + E

更多webstorm快捷功能参考:

webstorm那些好用的特性: 

http://blog.allenice233.com/2014/06/23/webstorm%E9%82%A3%E4%BA%9B%E5%A5%BD%E7%94%A8%E7%9A%84%E7%89%B9%E6%80%A7/

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏技术博文

php pathinfo()的用法

pathinfo — 返回文件路径的信息  mixed pathinfo ( string $path [, int $options = PATHINFO_D...

3427
来自专栏武军超python专栏

2018-7-16python中四种组合数据类型和pycharm的安装和使用

集合(set) discard删除数据时如果集合里面没有那个数据什么也不做,集合相减可以直接用-,+*/都不能用

995
来自专栏海天一树

小朋友学C语言(1):Hello World

首先,需要一款C语言的编译器,可以使用在线编译器,也可以在本地安装编译器,比如Mac电脑可以安装Xcode,PC可以安装Dev C++。 若是第一次编写程序,建...

2425
来自专栏cs

python数据类型

python编译图 运行python文件的时候,python会通过编译器将它编译成.pyc文件。 如果没有修改python文件,每次执行程序时,就执行前面运行...

2855
来自专栏PHP技术

CTF之PHP黑魔法总结

php黑魔法,是以前做CTF时遇到并记录的,很适合在做CTF代码审计的时候翻翻看看。 一、要求变量原值不同但md5或sha1相同的情况下 1.0e开头的全部相等...

4028
来自专栏Ryan Miao

js基础-表单验证和提交

基础知识: 原始提交如下: 1 <form action="/login" method="post" id="form1"> 2 <span>用户<...

2625
来自专栏知识分享

C中的预编译宏定义

文章来自 http://www.uml.org.cn/c++/200902104.asp 在将一个C源程序转换为可执行程序的过程中, 编译预处理是最初的步骤. ...

2364
来自专栏java思维导图

Vim 命令、操作、快捷键(收藏大全)

以:和/开头的命令都有历史纪录,可以首先键入:或/然后按上下箭头来选择某个历史命令。

793
来自专栏Java后端生活

Linux(六)vi和vim编辑器的使用

2525
来自专栏武军超python专栏

2018年7月25日python中将程序中的数据存储到文件中的具体代码实现

#将程序中的数据可以分别以二进制和字符串的形式存储到文件中 #首先引用pickle和json模块,实际应用中只需要引用一个就行

794

扫码关注云+社区