什么是HBuilder？HBuilder是DCloud（數字天堂）推出的一款支持HTML5的Web開發IDE。HBuilder的編寫用到了Java、C、Web和Ruby。HBuilder本身主體是由Java編寫，它基于Eclipse，所以順其自然地兼容了Eclipse的插件。快，是HBuilder的最大優勢，通過完整的語法提示和代碼輸入法、代碼塊等，大幅提升HTML、js、css的開發效率。如何安裝HBuilder？HBuilder下載地址：在HBuilder官網mand+P)進入邊改邊看模式,在此模式下,如果當前打開的是HTML文件，每次保存均會自動刷新以顯示當前頁面效果(若為JS、CSS文件，如與當前瀏覽器視圖打開的頁面有引用關系，也會刷新)HBuilder代碼塊大量減少重復代碼工作量在打開的getstart.html中輸入H,如下圖然后按下8,自動生成HTML的基本代碼如下圖什么是代碼塊?代碼塊是常用的代碼組合，比如在js中輸入$，回車，則可以自動輸入document.getElementById(id)。查看、編輯代碼塊可以在工具-自定義代碼塊中，選擇相應的代碼塊進行查看和編輯。也可以在激活代碼塊的代碼助手中，點擊詳細信息右下角的修改圖標進行修改和查看。代碼塊激活字符原則1:連續單詞的首字母。比如：dg激活document.getElementById("");vari激活vari=0;dn激活display:none;代碼塊激活字符原則2:整段HTML一般使用tag的名稱。比如script、style，通常，敲最多4個字母即可匹配到需要的代碼塊，不需要完整錄入，如sc回車、st回車，即可完成script、style標簽的輸入。代碼塊激活字符原則3:同一個tag，有多個代碼塊輸出，則在最后加后綴。比如Meta輸出但Metau則輸出，Metag同理。代碼塊激活字符原則4:如果原始語法超過4個字符，針對常用語法，則第一個單詞的激活符使用縮寫。比如inputbutton，縮寫為inbutton，同理intext是輸入框。代碼塊激活字符原則5:js的關鍵字代碼塊，是在關鍵字最后加一個重復字母。比如if直接敲會提示if關鍵字，但iff回車，則出現if代碼塊。類似的有forr、withh等。由于funtion字母較長，為加快輸入速度，取fun縮寫，比如funn，輸出function代碼塊，而funa和func，分別輸出匿名函數和閉包。靈活的快捷鍵使得編程過程手不離鍵盤效果如下圖新建html基本模板后,當前光標處于title標簽內,此時我們給HTML設置title:hellohbuilder,完成后使用Ctrl+回車在當前的下一行插入空行,并將光標移動到下一行我們在此處使用sc代碼塊生成一個script塊來編寫js代碼(輸入sc,回車)如下圖使用funn代碼塊編寫一個JS方法helloworld(輸入funn,回車)如下圖此時生成的方法的方法名是選中狀態,我們只需要直接輸入新的方法名helloworld即可,如下圖上圖中的綠色豎線，是代碼塊中指定的下一個編輯位置,敲擊回車光標會直接跳轉至豎線位置此時按向下、向下,Ctrl+回車,輸入style回車,生成css代碼區域定義一個Css類classA：輸入.classA{回車,font回車回車回車然后按alt+下,alt+下跳轉至下一個編輯區域依次輸入div.logo+ul#navigation>li*2>a,按下tab生成代碼如下圖HBuilder集成了emmet功能,可以通過CSS選擇器語法來快速開發HTML和CSS,如想深入了解emmet請移步http://www.emmet.io/強大的JS解析引擎大大加快JS開發的速度JS中提示HTML、CSSJS提示html的IDJS提示html的tagnameJS提示css類名JS通過ID、tagname、css類名不但可以獲取HTML元素,還可以精確分析出其元素類型,準確提示其屬性,如上圖可以提示出list[0].typeJS中提示JSONJS提示自定義系統方法JS提示對象引用及其屬性、方法JS提示閉包對象跳轉到class、id、js方法定義處按下Alt,左鍵點擊引用的方法名、ID、CSS類、文件(鏈接、圖片),均可跳轉到引用的地方,跨文件的引用也可以哦跳轉到JS方法定義處如下圖跳轉到CSS類定義處如下圖跳轉到ID定義處如下圖跳轉到文件如下圖更多挖寶跳轉助手、選擇助手、轉義助手、快捷鍵助手，讓你手不離鍵盤。HTML5+支持、手機真機連調、云編譯，方便開發跨手機平臺的APP。更多精彩功能：重構|大綱|任務|版本歷史|內置webserver|實時升級|安全工程管理|包圍|掩碼轉換|智能糾錯|折疊代碼|轉到定義|格式化代碼|URL編解碼|進制轉換|自動閉合。還不滿足？下載插件增強更多功能，高手更可開發插件，并共享插件造福所有開發者。