雖然HTML5仍然是一個相對較新的標準,但有很多開放的和需要付費的資源來幫你使用Javascript來為HTML5工作。
Javascript對很多HTML5的元素都是必需的,比如canvas,audio和WebGL。然而在我看來,有些工具,庫和框架資源能幫助到你,下面就讓我們來看看這其中的一些資源。
1.HTML5樣板
可能你已經在用HTML5了,那么你就了解這方面了。樣本允許你使用可下載的模板來建立很棒的站點,這些模板包括Normalize.css,jQuery和Modernizr(后面有更多介紹)。如果你需要的東西有點不同而自己不能創建的話你也可以要求定制框架。
HTML5樣板還包括了Apache設置,以為您更方便地提供卓越的性能。
2.Fabric.js
這是一個使用HTML5新元素(比如畫布)的JS庫。你可以用它來解析SVG元素,并使用內置的對象,比如分組和遮蔽。Fabric.js能幫你輕松地創建動畫,從簡單的幾何形狀到真實圖像或高分辨率圖像都適用。然而,你不需要Fabric.js在畫布上創建繪畫,它能讓你輕松地創建更復雜的圖形,操作和制作動畫更稱心如意。它有一個擴展的事件系統,允許你執行諸如鼠標滑過之類的操作。它還能讓你在每一個像素點上進行拖放操作。
3.Modernizr
正如上面所說,Modernizr是Web上最流行的JS庫之一,有幾個框架都包含這個庫。使用Modernizr,你能在即使瀏覽器都不支持HTML5的情況下使用有條件的JS和CSS來幫助創建網頁。它的工作原理是在頁面加載上運行,以挑選特性然后創建一個JS對象,并反過來增加HTML元素的類,以讓你使用CSS。它是開源的,允許設計者使用HTML5和CSS3,通過有條件的加載與回退,這樣即使沒有最新版本瀏覽器的用戶也能擁有良好的體驗了。
如果你是一個WordPress愛好者,那么還有一個要自己手動安裝的可用的Modernzir的插件。
4.Backbone.js
它允許你通過增加綁定鍵值的模型和自定義事件來創建Web應用程序。它可以連接到所有預配置的JSONAPI,并且是有著大量事件處理功能的豐富的API。Backbone允許你把數據當做模型來處理,當用戶的行為導致數據發生改變時,模型會自動觸發一個改變事件。這意味著模型改變時它會相應地更新HTML,而不用再從別處粘貼代碼。
DocumentCloud就是使用Backbone做的,你可以去看看。
5.DirtyMarkup
你更喜歡在本地工作時使用網絡工具么?那你就試試DirtyMarkup吧,尤其是當涉及到JS你沒有充分自信的時候,或者當你是一個web開發新手的時候。它是一個免費的應用,能夠用來快速、簡單地清理代碼,并且不僅僅適用于JS。你還能用它來清理HTML5和CSS代碼,因為它整合了HTML清理、CSS清理和JS美化到一起,給你一個在同一地方就能整理所有代碼的很棒的資源。
除了這些,它還使用了Ace編輯器,這個是與SublimeText有類似功能的線上代碼編輯器。對DirtyMarkup來說,你可以選擇清理哪部分代碼:把這段代碼粘貼進選項框旁邊的編輯器框里,然后點擊“清理”按鈕就可以了。簡單滴很!
6.JFormer
這是一個添加表格的簡單有效的資源,是精通了jQuery的開發者寫的。它允許你驗證表格,客戶端和服務器端,并使用Ajax在不改變頁面的情況下進行處理。使用JFormer生成的表格符合所有必要的標準。
JFormer在MIT的許可下就能***,也有能幫你運行地更快更方便的現成模板。你也可以編輯CSS,讓表格的樣式更適合你的項目。
7.Live.js
這是一個監測工具,通過發送標題請求給服務器來對Javascript和CSS進行監測。任何有必要的更改都會動態地應用于CSS、HTML和Javascript上,頁面會自動重載。
它的框架和語言是獨立的,意味著它能夠使用許多種語言,并與Firefox,Chrome,Safri,Opera和IE6以上的瀏覽器兼容。據開發者說,有了Live.js你就可以告別Alt-Tab了!
8.Chart.js
這是一個使用畫布和SVG元素創建各種各樣的圖表(餅狀圖、調查圖和環形圖等)的很方便的工具。雖然它不能交互,但你可以用Fabric.js來實現這點。然而,它能被用于SVG元素的動畫。
它允許你創建復雜的圖表,使用SVG時將會有更佳的滾動和頁面性能。
9.Grunt
這已成為一個非常受歡迎的資源。Grunt是一個運行在Javascript上的任務,它允許你自動執行傾向于重復性(包括簡化,編譯,單元測試及更多)的常見任務。Grunt也有一個很大很有用的生態系統,包括了很多能幫你自動執行任務的插件。
10.Cocos2D-Javascript
對你們中間的喜歡開發游戲的人來說,Cocos2D-javascript是一個在瀏覽器里運行游戲的2D游戲和圖形的引擎。這意味著你你可以在不用安裝額外插件(如Flash和Java)的情況下在瀏覽器里進行2D渲染。雖然有文件指出由于對HTML5的不支持,不是所有的瀏覽器都支持內在渲染,但這已經不再是個問題了。工作中我在大多數瀏覽器上都測試過畫布和SVG項目。然而,使用舊版本瀏覽器的用戶通過插件創建一個讓游戲播放的回退就不再有任何傷害了。
這就是所有的資源了!企業
網站建設常見問題