特別推薦：開發者的10個最佳代碼遊樂場

1. Codepen

　　CodePen是一個web先後端遊樂場。它基於激發、傳授和分享。能高亮熱門示例(「Pen」)，且提供高級功能， 如共享和嵌入。須要創建一個減小測試案例來演示並找出一個bug?CodePen絕對適合這個場景。想炫耀你的最新創做和得到同行的反饋? CodePen是絕一不二的選擇。

　　2. CSSDesk

　　CSSDesk是一個在線CSS沙箱。它令人們可以快速測試的CSS代碼片斷，並觀察實時結果。我有很是看好這個項目。有行號和文本框輸入實時語法高亮顯示。其中一個最好的一點是它容許用戶與他人分享他們的代碼。

　　3. Google’s Code Playground

　　谷歌的代碼遊樂場是一個基於Web的工具，可讓Web開發人員嘗試谷歌全部提供的API，調整代碼，和查看結果。谷歌的代碼遊樂場可讓您盡情享受而沒必要打開一個外部編輯器，全部的API都被裝載在(左側)「Pick an API」框中。

　　4. JS Bin

　　JS Bin是一個web app，專門設計於幫助JavaScript和CSS親們在某些上下文中測試和協做調試代碼。 JS Bin容許你編輯和測試JavaScript和HTML。一旦滿意，你能夠保存併發送這URL給同行審查或尋求幫助。而後，他們能夠作更進一步的修改，若是須要保存更新。

　　5. JSFiddle

　　JSFiddle中是一個shell編輯器，經過建立基於流行JS框架的自定義環境，簡化JavaScript的編寫。 你能夠選擇框架和版本(可選的有MooTools，jQuery，ojo, Prototype, YUI, Glow,Vanilla)。此外，若是行的話，你能夠添加jQuery UI或MooTools More之類的免費框架。它具備一個極好的特徵是可以產生一個惟一的URL以保存和分享代碼。另外，JSFiddle也自帶嵌入特徵。它是無需網站就可嘗 試和分享JS代碼的極佳平臺。

　　6. Dabblet

　　Dabblet是快速測試CSS和HTML代碼片斷的交互式遊樂場。它使用-prefix-free，沒必要在你的 CSS代碼添加任何前綴。能夠在Github gist保存工做內容，將其嵌入到其餘網站和與他人分享。它目前只支持Chrome，Safari和Firefox的現代版本。全部發布的代碼屬於發佈 者，沒有強制許可證。 Dabblet自己是開源軟件，在NPOSL-3.0許可下發布。

　　7. Editr

　　Editr是一個集HTML，CSS和JavaScript的遊樂場，你能夠在本身的服務器上託管。它是基於ACE的編 輯器。它的超級容易安裝。它支持一個頁面多個實例。能夠經過JS對象或HTML屬性進行配置。 Editr支持3種視覺佈局：水平，垂直和單一。前兩個是用於在線編輯。第三個是用於演示。 Editr基於MIT License。

　　8. Livewave

　　Liveweave是用於HTML五、CSS三、JavaScript的遊樂場和用於網頁設計師和開發者實時編輯器。 這是用來測試，練習和分享成果的好工具!面板大小可調，可讓你爲所欲爲寫(或織，如咱們稱呼它名字同樣)代碼。 Liveweave還內置了對HTML5和CSS3的標籤/屬性上下文敏感的代碼提示，使生活變得更加簡單。

　　9. D3 Playground

　　D3.js設計目的在於讓你可以以交互方式使用D3.js庫。每一次編輯(產生有效代碼)都會實時影響D3.js遊樂場。由於CSS是可視化的重要組成部分，你也能夠在線編輯CSS。

　　10. HTML5 Playground

　　HTML5的遊樂場包括一個能夠看HTML5動做的代碼庫。它們包括一些基礎啓動例程，如HTML5 Doctype和音頻標記(仍然是兼容瀏覽器中回放特性的好demo)。擁有一個交互表格，包含HTML5元素，如範圍、日期輸入和針對電子郵件地址和網站的自動驗證。