創建一個編輯器 · wangEditor3使用手冊

# 簡單的 demo > 【注意】wangEditor3 已停止維護，請使用 wangEditor 最新版本，具體查看[官網]((http://www.wangeditor.com/) )。 ## 下載 - 點擊 [https://github.com/wangfupeng1988/wangEditor/releases](https://github.com/wangfupeng1988/wangEditor/releases) 下載最新版。進入`release`文件夾下找到`wangEditor.js`或者`wangEditor.min.js`即可 - 使用CDN：[//unpkg.com/wangeditor/release/wangEditor.min.js](https://unpkg.com/wangeditor/release/wangEditor.min.js) - 使用`bower`下載：`bower install wangEditor` （前提保證電腦已安裝了`bower`） *PS：支持`npm`安裝，請參見后面的章節* ## 制作 demo 編輯器效果如下。 ![圖片](https://camo.githubusercontent.com/f3d072718d8fcbbacf8cc80465a34cceffcf5b4a/687474703a2f2f696d61676573323031352e636e626c6f67732e636f6d2f626c6f672f3133383031322f3230313730352f3133383031322d32303137303533303230323930353633332d313834303135383938312e706e67) 代碼示例如下。**注意，以下代碼中無需引用任何 CSS 文件！！！** ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>wangEditor demo</title> </head> <body> <div id="editor"> <p>歡迎使用 <b>wangEditor</b> 富文本編輯器</p> </div>  <script type="text/javascript" src="/wangEditor.min.js"></script> <script type="text/javascript"> var E = window.wangEditor var editor = new E('#editor') // 或者 var editor = new E( document.getElementById('editor') ) editor.create() </script> </body> </html> ``` 如果想要自己控制編輯區域的高度、寬度等尺寸信息，參見 [菜單與編輯區域分離](http://www.hmoore.net/wangfupeng/wangeditor3/335771)