HBuilderX是一款簡(jiǎn)答實(shí)用的h5編程開(kāi)發(fā)工具,能快速對(duì)編程語(yǔ)音進(jìn)行生成操作,軟件界面干凈清爽,功能強(qiáng)大語(yǔ)音代碼錄入自動(dòng)生成,代碼保存存儲(chǔ)不丟失??靵?lái)旋風(fēng)軟件園使用體驗(yàn)吧!
HBuilderX是編輯器和IDE的完美結(jié)合,HBuilderX是HBuilder的下一代產(chǎn)品,體積小巧,啟動(dòng)秒開(kāi),默認(rèn)包包含優(yōu)秀的字處理能力,創(chuàng)新眾多其他編輯器不具備的高效字處理模型,HBuilderX是最快的HTML開(kāi)發(fā)工具,強(qiáng)大的代碼助手幫你快速完成開(kāi)發(fā),最全的語(yǔ)法庫(kù)和瀏覽器兼容性數(shù)據(jù)讓瀏覽器碎片化不再頭痛。
邊改邊看:一邊寫代碼,一邊看效果
強(qiáng)悍的轉(zhuǎn)到定義和一鍵搜索
這里還有最全的語(yǔ)法庫(kù)、最全的語(yǔ)法瀏覽器兼容庫(kù)
代碼輸入法:按下數(shù)字快速選擇候選項(xiàng)
可編程代碼塊:一個(gè)代碼塊,少敲50個(gè)按鍵
內(nèi)置emmet:tab一下生成一串代碼
無(wú)死角提示:除了語(yǔ)法,還能提示ID、Class、圖片、鏈接、字體…
跳轉(zhuǎn)助手、選擇助手,不用鼠標(biāo),手不離鍵盤
多種語(yǔ)言支持:php、jsp、ruby、python、nodejs等web語(yǔ)言,less、coffee等編譯型語(yǔ)言均支持
1、極速
不管是啟動(dòng)速度、大文檔打開(kāi)速度、編碼提示,都極速響應(yīng)
2、清爽護(hù)眼
界面清爽簡(jiǎn)潔,綠柔主題經(jīng)過(guò)科學(xué)的腦疲勞測(cè)試,是最適合人眼長(zhǎng)期觀看的主題界面
3、輕巧
僅10M的綠色發(fā)行包
4、markdown優(yōu)先
HX是唯一一個(gè)新建文件默認(rèn)類型是md的編輯器。
除了頂尖的markdown編寫體驗(yàn)、漂亮的著色外,HX的極速啟動(dòng)、多標(biāo)簽、熱退出、各種快捷鍵操作,都給了你充足的理由升級(jí)記事本工具。
5、無(wú)鼠標(biāo)操作
掌握HX的無(wú)鼠標(biāo)操作體系,成為高效極客,飛一般編碼
智能雙擊
下面是智能雙擊選中tag和包圍父tag的示例
1. 雙擊div的首或尾可以選中這個(gè)tag。當(dāng)然雙擊if、雙擊縮進(jìn)符、雙擊括號(hào)引號(hào)內(nèi)側(cè)...很多位置都可以通過(guò)智能雙擊選中。具體見(jiàn)HBuilder的選擇菜單。
2. 按Ctrl+]包圍,就可以在這個(gè)選區(qū)首尾加父標(biāo)簽,同時(shí)閃爍光標(biāo)。當(dāng)前在js里按下Ctrl+]不會(huì)包圍tag,而是包圍if、for等函數(shù)庫(kù)。
3. 輸入div即可在首尾添加包圍標(biāo)簽
擴(kuò)大選區(qū)Ctrl+=
=是+的默認(rèn)鍵位置,所以Ctrl+=其實(shí)就是Ctrl鍵和+號(hào)一起按下。
在HBuilderX里可以智能的判斷選區(qū)范圍,持續(xù)擴(kuò)大選區(qū),無(wú)鼠標(biāo)快速選中你需要的選區(qū)。
反包圍
上面講到包圍,也自然有反包圍。
1. 雙擊tag p開(kāi)頭,選中該tag。
2. 按反包圍Ctrl+Shift+],可去掉tag p并自動(dòng)處理子節(jié)點(diǎn)的縮進(jìn)。
這里多提一句HBuilderX的快捷鍵理念,就是符號(hào)化,而不是字母化。
很多工具的快捷鍵都是控制鍵+功能英文單詞中的一個(gè)字母,這個(gè)是極難記憶的。
符號(hào)化讓快捷鍵的記憶變簡(jiǎn)單,比如Ctrl+]是包圍。
而反操作或增強(qiáng)操作一般是加Shift,比如Ctrl+Shift+]是反包圍。
選中相同語(yǔ)法詞
下圖中,使用普通的選擇相同詞,會(huì)把所有div都選中。但使用Ctrl+Shift+e(mac是Command+Shift+d),會(huì)智能識(shí)別語(yǔ)法,剔除不相干的詞。
下圖按下Ctrl+Shift+e同時(shí)選中tag首尾的div,而不會(huì)選中子節(jié)點(diǎn)的div。
然后就可以方便的將原div改名為p
選擇一個(gè)括號(hào)時(shí),也可以使用選中相同語(yǔ)法詞,來(lái)選中對(duì)應(yīng)的另一個(gè)括號(hào)
交換選區(qū)內(nèi)容
當(dāng)需要交互2個(gè)選區(qū)的內(nèi)容時(shí),選中a、剪切、點(diǎn)b前面、粘貼、選中b、找到之前a的位置點(diǎn)擊、粘貼...這么長(zhǎng)的操作太低效。
來(lái)看HBuilderX的Ctrl+Shift+x交互選區(qū),也就是Ctrl+x的增強(qiáng)版。
1. 雙擊第1個(gè)style屬性后的引號(hào)內(nèi)側(cè),可選中引號(hào)內(nèi)容。
2. 按下Ctrl后繼續(xù)雙擊第2個(gè)style屬性后的引號(hào)內(nèi)側(cè),可選中2個(gè)引號(hào)內(nèi)的選區(qū)。
3. 按下Ctrl+Shift+x,交換style屬性的內(nèi)容。
如果不選擇內(nèi)容,光標(biāo)放置到2行,可直接交換這2行的內(nèi)容,如下圖
撤銷最后一個(gè)多選區(qū)或多光標(biāo)
選區(qū)選多了或選錯(cuò)了,不用擔(dān)心要重頭選,Ctrl+Shift+z不是撤銷編輯內(nèi)容,而是撤銷最后一個(gè)選區(qū)。
1. 雙擊選中class
2. 按Ctrl+e選中相同詞
3. 按Ctrl+Shift+z,不再選中最后一個(gè)詞。
批量合并行
下圖示例,是把css合并為一行時(shí)的快捷操作
1. 雙擊{內(nèi)側(cè)選中class
2. 按Ctrl+雙擊選中另一個(gè)class
3. 按反格式化Ctrl+Shift+k,可以把每個(gè)css的區(qū)塊代碼都合并為一行
Ctrl+k是格式化代碼,那么Ctrl+Shift+k就是合并為一行。
同時(shí)注釋if段首尾
if塊的調(diào)整很常見(jiàn),除了包圍、反包圍外,常用操作還有同時(shí)注釋掉if段首尾。
1. 雙擊if選中if代碼塊
2. 按Ctrl+\在選區(qū)首尾加光標(biāo),變成多光標(biāo)模式
3. 按Ctrl+/注釋掉選區(qū)首尾 行
大?。?66.00M / 版本:v3.3.13.20220314 官方版
大小:53.35M / 版本:v3.3.13.20220314 官方版
大小:78.17M / 版本:v3.3.13.20220314 官方版
大?。?.84M / 版本:v3.3.13.20220314 官方版
大?。?4.58M / 版本:v3.3.13.20220314 官方版
大?。?.03M / 版本:v3.3.13.20220314 官方版
大?。?91.00M / 版本:v3.3.13.20220314 官方版
大小:20.40M / 版本:v3.3.13.20220314 官方版
大?。?6.56M / 版本:v3.3.13.20220314 官方版
大?。?27.69M / 版本:v3.3.13.20220314 官方版
大?。?66.78M / 版本:v3.3.13.20220314 官方版
大?。?.48M / 版本:v3.3.13.20220314 官方版