開發的功能主要涉及即時代碼著色（CodeColoring）和語法提示（CodeHints）功能，稍后會總結功能開發中問題或提供源碼。
以下是個人對Range對象的了解和常用操作的實例和總結：
Range對象
Range對象表示文檔的連續范圍區域，如用戶在瀏覽器窗口中用鼠標拖動選中的區域。
dom標準Range對象
http://www.w3school.com.cn/xmldom/dom_range.asp
在ie中使用TextRange對象
http://www.hbcms.com/main/dhtml/objects/obj_textrange.html
range對象常用的建立方法
在開發中除了上述文檔中的標準建立方法，大多如下方式建立
標準dom:
var range=window.getSelection().getRangeAt(0);
ie:
var range=document.selection.createRange();
注意：標準dom是從window中獲取selection對象，而ie是從document對象中獲取。
標準dom range對象(以下稱dom rang)和ie的TextRange對象(以下稱TextRange),在操作模式上有很大區別，可以說dom range是基于dom結構控制的，TextRange是基于文本節點字節控制的，閱讀下面示例會更好理解這二者的操作模式。以下所說的range對象是指在html結構中進行選擇和更改（designMode=on contentEditable=true狀態下）操作，在textarea中的操作比這簡單，不是當前的研究環境。
range對象的具體方法和屬性請查看上邊列出的相關api文檔，下面對實際開發過程中常用功能講解
1.區域選擇 獲取區域中文本
TextRange的區域選擇
TextRange對象主要使用以下方法控制區域的選擇：moveStart moveEnd move
這三個函數使用相同的參數語法:fn(sUnit [, iCount])
第一個參數是指移動的單位，可以使用的參數：character（字符）、word（詞）、sentence（段落）、textedit（整個編輯區）
第二個參數指移動的數量單位，負數向所在位置之前移動，正數向所在位置之后移動。
在實際開發中一般使用character，其他幾個參數在中文環境和html編輯時，和預想位置有偏差。
例1：TextRange選擇光標前4個字符
代碼如下:
var rg=document.selection.createRange();
rg.moveStart("character",-4);
rg.select();//顯式選擇文本區域，不調用此函數也可以獲得選擇的內容
var text=rg.text;//獲得選擇的文本
var htmlText=rg.htmlText;//獲得選擇文本的html代碼

用rg.htmlText獲得選擇文本的html代碼，但獲得結果不盡人意，
如:<b>aaaa</b>bb ,當選擇aabb段時，.htmlTex返回的是<b>aa</b>bb而不是aa</b>bb
其他常用位置控制函數：
collapse： 合并前后選擇點，true為開始點，false為結尾點。
moveToPoint： 移動光標到坐標 moveToBookmark： 移動到書簽。
dom range的區域選擇
dom range對象選擇區域主要以dom節點為為坐標，所有邊界移動和區域選擇函數都是以dom節點為參照的
setEnd()setStart()是控制范圍的前邊界點和后邊界點位置的函數，