在線的HTML內容編輯器為用戶提供文本的樣式控制，例如文字的顏色、字體大 小等。雖然現在網上有不少功能強大的編輯器（如：FCKEditor），但是在使用中 需要許多復雜的配置，而且代碼往往比較“臃腫”。本文的目的就是介紹如何開 發一個HTML編輯器。應用本文介紹的方法，可以方便的開發出滿足自己需求的， 代碼相對比較精簡的HTML編輯器。以下是一個應用本文方法開發的HTML編輯器， 實現了一些簡單的功能：
開發方法如下：
1.添加一個可編輯的iframe
實現HTML編輯器的第1步就是在網頁中放置一個可編輯的iframe用來輸入文本 ，使iframe可編輯方法相當簡單，只需要將iframe的designMode設置為on即可， 具體步驟如下：
var editor = document.getElementById("IFRAME的ID");
var editorDoc = editor.contentWindow.document;
var editorWindow = editor.contentWindow;
editorDoc.designMode = "on";
editorDoc.open();
editorDoc.write("<html><head></head><body style='margin:0px; padding: 0px;'></body></html>");
editorDoc.close();
2.設置選中文本的樣式
設置選中文本樣式的方法最簡單的方式就是使用document.execCommand,但是 execCommand功能比較局限，有時不能滿足需求，例如：execCommand設置字體大 小只能是1-7,不能使用像素大小，而且如果你在點擊工具欄按鈕到調用 execCommand的過程中點擊了其他的 DIV，iframe的選中內容會消失，這時調用 execCommand是無效的。因此本文介紹另一種方法，基本思路如下：
(1) 獲取選中的HTML；
(2) 修改HTML的樣式；
(3) 用修改後的HTML替換選中的HTML。
2.1 獲取選中的HTML
在不同的浏覽器中獲取選中的HTML的方法是不同的，在IE中可以使用
var range = document.selection.createRange()
在Firefox,Chrome中則使用
var range = window.getSelection().getRangeAt(0);
2.2 替換選中的HTML
通過2.1的方法獲取了表示選中內容的對象後，就可以調用其方法來替換掉選 中的內容。在不同的浏覽器中替換選中的HTML的方法有所差異，在IE中可以只需 調用range.pasteHTML就行了，在Firefox,Chrome中則使用range.deleteContents 和 range.insertNode 兩個方法來實現
