-
1 自動注釋和撤銷注釋:ctrl+/
在一句代碼前面用 ctrl+/ 可以自動注釋和撤銷注釋,js,html都
可以,很好的省去了敲注釋符的時間 (mac下為command+/,下同) -
2 自動補全html標簽
我們知道在使用linux命令的時候按tab鍵有自動補全的功能,在很多編譯器里也是,在webstorm中當 你想敲一些html元素時,比如:
(1)想敲一對h1標簽,只需要敲h1,按tab鍵,變回自動補全為:<h1></h1>
(2)想輸入帶id的,如<div id="abc"></div>只需要輸入:div#abc,按Tab鍵,便會自動補全。
(3)想輸入帶class的,如 <div class="abc"></div>只需要輸入: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>
(5)特定屬性的標簽的補全:
a[href=#] tab后:
<a href="#"></a>
ul.menu>li*6>a[href=#]{HTML}
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>
更多代碼簡寫補全的技巧可以參考:
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
Mac
command+option+L
-
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/