WebStorm快捷鍵總結

1. 自動注釋和撤銷注釋：ctrl+/

在一句代碼前面用 ctrl+/ 可以自動注釋和撤銷注釋，js,html都可以，很好的省去了敲注釋符的時間

（mac下為command+/,下同）

2. 自動補全html标簽

我們知道在使用linux指令的時候按tab鍵有自動補全的功能，在很多編譯器裡也是，在webstorm中當你想敲一些html元素時，比如:

1. 想敲一對h1标簽，隻需要敲h1,按tab鍵，變回自動補全為：
2. 想輸入帶id的，隻需要輸入:div#abc,按Tab鍵，便會自動補全為:
3. 想輸入帶class的，隻需要輸入: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. 特定屬性的标簽的補全：a[href=#]，tab後：
2. 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就會自動尋找所有包含該内容的檔案了。

尋找代碼定義位置

很多時候我們想查找某個函數或者變量定位的位置，按住command（ctrl）鍵，點選要查找的内容，webstorm就會自動跳轉到它定義的地方了，這個方法能夠很好的提高開發和閱讀代碼的效率。

大小寫轉化

有時候需要快速的把一段字母轉成全大寫或全小寫，隻需要使用：Command（ctrl）+shift+U

7 全局查找

輕按兩下 shift

查找最近打開的檔案

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/