cument.execCommand()用法深入理解

更新時間：2012年12月04日 08:58:27 作者：
本文將詳細(xì)介紹cument.execCommand()用法,需要了解的朋友可以參考下
 
D-Position 允許通過拖曳移動絕對定位的對象。 
AbsolutePosition 設(shè)定元素的 position 屬性為“absolute”(絕對)。 
BackColor 設(shè)置或獲取當(dāng)前選中區(qū)的背景顏色。 
BlockDirLTR 目前尚未支持。 
BlockDirRTL 目前尚未支持。 
Bold 切換當(dāng)前選中區(qū)的粗體顯示與否。 
BrowseMode 目前尚未支持。 
Copy 將當(dāng)前選中區(qū)復(fù)制到剪貼板。 
CreateBookmark 創(chuàng)建一個書簽錨或獲取當(dāng)前選中區(qū)或插入點的書簽錨的名稱。 
CreateLink 在當(dāng)前選中區(qū)上插入超級鏈接，或顯示一個對話框允許用戶指定要為當(dāng)前選中區(qū)插入的超級鏈接的 URL。 
Cut 將當(dāng)前選中區(qū)復(fù)制到剪貼板并刪除之。 
Delete 刪除當(dāng)前選中區(qū)。 
DirLTR 目前尚未支持。 
DirRTL 目前尚未支持。 
EditMode 目前尚未支持。 
FontName 設(shè)置或獲取當(dāng)前選中區(qū)的字體。 
FontSize 設(shè)置或獲取當(dāng)前選中區(qū)的字體大小。 
ForeColor 設(shè)置或獲取當(dāng)前選中區(qū)的前景(文本)顏色。 
FormatBlock 設(shè)置當(dāng)前塊格式化標(biāo)簽。 
Indent 增加選中文本的縮進。 
InlineDirLTR 目前尚未支持。 
InlineDirRTL 目前尚未支持。 
InsertButton 用按鈕控件覆蓋當(dāng)前選中區(qū)。 
InsertFieldset 用方框覆蓋當(dāng)前選中區(qū)。 
InsertHorizontalRule 用水平線覆蓋當(dāng)前選中區(qū)。 
InsertIFrame 用內(nèi)嵌框架覆蓋當(dāng)前選中區(qū)。 
InsertImage 用圖像覆蓋當(dāng)前選中區(qū)。 
InsertInputButton 用按鈕控件覆蓋當(dāng)前選中區(qū)。 
InsertInputCheckbox 用復(fù)選框控件覆蓋當(dāng)前選中區(qū)。 
InsertInputFileUpload 用文件上載控件覆蓋當(dāng)前選中區(qū)。 
InsertInputHidden 插入隱藏控件覆蓋當(dāng)前選中區(qū)。 
InsertInputImage 用圖像控件覆蓋當(dāng)前選中區(qū)。 
InsertInputPassword 用密碼控件覆蓋當(dāng)前選中區(qū)。 
InsertInputRadio 用單選鈕控件覆蓋當(dāng)前選中區(qū)。 
InsertInputReset 用重置控件覆蓋當(dāng)前選中區(qū)。 
InsertInputSubmit 用提交控件覆蓋當(dāng)前選中區(qū)。 
InsertInputText 用文本控件覆蓋當(dāng)前選中區(qū)。 
InsertMarquee 用空字幕覆蓋當(dāng)前選中區(qū)。 
InsertOrderedList 切換當(dāng)前選中區(qū)是編號列表還是常規(guī)格式化塊。 
InsertParagraph 用換行覆蓋當(dāng)前選中區(qū)。 
InsertSelectDropdown 用下拉框控件覆蓋當(dāng)前選中區(qū)。 
InsertSelectListbox 用列表框控件覆蓋當(dāng)前選中區(qū)。 
InsertTextArea 用多行文本輸入控件覆蓋當(dāng)前選中區(qū)。 
InsertUnorderedList 切換當(dāng)前選中區(qū)是項目符號列表還是常規(guī)格式化塊。 
Italic 切換當(dāng)前選中區(qū)斜體顯示與否。 
JustifyCenter 將當(dāng)前選中區(qū)在所在格式化塊置中。 
JustifyFull 目前尚未支持。 
JustifyLeft 將當(dāng)前選中區(qū)所在格式化塊左對齊。 
JustifyNone 目前尚未支持。 
JustifyRight 將當(dāng)前選中區(qū)所在格式化塊右對齊。 
LiveResize 迫使 MSHTML 編輯器在縮放或移動過程中持續(xù)更新元素外觀，而不是只在移動或縮放完成后更新。 
MultipleSelection 允許當(dāng)用戶按住 Shift 或 Ctrl 鍵時一次選中多于一個站點可選元素。 
Open 打開。 
Outdent 減少選中區(qū)所在格式化塊的縮進。 
OverWrite 切換文本狀態(tài)的插入和覆蓋。 
Paste 用剪貼板內(nèi)容覆蓋當(dāng)前選中區(qū)。 
PlayImage 目前尚未支持。 
Print 打開打印對話框以便用戶可以打印當(dāng)前頁。 
Redo 重做。 
Refresh 刷新當(dāng)前文檔。 
RemoveFormat 從當(dāng)前選中區(qū)中刪除格式化標(biāo)簽。 
RemoveParaFormat 目前尚未支持。 
SaveAs 將當(dāng)前 Web 頁面保存為文件。 
SelectAll 選中整個文檔。 
SizeToControl 目前尚未支持。 
SizeToControlHeight 目前尚未支持。 
SizeToControlWidth 目前尚未支持。 
Stop 停止。 
StopImage 目前尚未支持。 
StrikeThrough 目前尚未支持。 
Subscript 目前尚未支持。 
Superscript 目前尚未支持。 
UnBookmark 從當(dāng)前選中區(qū)中刪除全部書簽。 
Underline 切換當(dāng)前選中區(qū)的下劃線顯示與否。 
Undo 撤消。 
Unlink 從當(dāng)前選中區(qū)中刪除全部超級鏈接。 
Unselect 清除當(dāng)前選中區(qū)的選中狀態(tài)。 
<HTML> 
<HEAD> 
<TITLE>JavaScript--execCommand指令集</TITLE> 
<SCRIPT LANGUAGE="javascript"> 
<!-- 
/* 
*該function執(zhí)行copy指令 
*/ 
function fn_doufucopy(){ 
edit.select(); 
document.execCommand('Copy'); 
} 
/* 
*該function執(zhí)行paste指令 
*/ 
function fn_doufupaste() { 
tt.focus(); 
document.execCommand('paste'); 
} 
/* 
*該function用來創(chuàng)建一個超鏈接 
*/ 
function fn_creatlink() 
{ 
document.execCommand('CreateLink',true,'true');//彈出一個對話框輸入URL 
//document.execCommand('CreateLink',false,'http://www.51js.com'); 
} 
/* 
*該function用來將選中的區(qū)塊設(shè)為指定的背景色 
*/ 
function fn_change_backcolor() 
{ 
document.execCommand('BackColor',true,'#FFbbDD');//true或false都可以 
} 
/* 
*該function用來將選中的區(qū)塊設(shè)為指定的前景色,改變選中區(qū)塊的字體大小,改變字體,字體變粗變斜 
*/ 
function fn_change_forecolor() 
{ 
//指定前景色 
document.execCommand('ForeColor',false,'#BBDDCC');//true或false都可以 
//指定背景色 
document.execCommand('FontSize',false,7); //true或false都可以 
//字體必須是系統(tǒng)支持的字體 
document.execCommand('FontName',false,'標(biāo)楷體'); //true或false都可以 
//字體變粗 
document.execCommand('Bold'); 
//變斜體 
document.execCommand('Italic'); 
} 
/* 
*該function用來將選中的區(qū)塊加上不同的線條 
*/ 
function fn_change_selection() 
{ 
//將選中的文字加下劃線 
document.execCommand('Underline'); 
//在選中的文字上劃粗線 
document.execCommand('StrikeThrough'); 
//將選中的部分文字變細(xì) 
document.execCommand('SuperScript'); 
//將選中區(qū)塊的下劃線取消掉 
document.execCommand('Underline'); 
} 
/* 
*該function用來將選中的區(qū)塊排成不同的格式 
*/ 
function fn_format() 
{ 
//有序列排列 
document.execCommand('InsertOrderedList'); 
//實心無序列排列 
document.execCommand('InsertUnorderedList'); 
//空心無序列排列 
document.execCommand('Indent'); 
} 
/* 
*該function用來將選中的區(qū)塊剪下或是刪除掉 
*/ 
function fn_CutOrDel() 
{ 
//刪除選中的區(qū)塊 
//document.execCommand('Delete'); 
//剪下選中的區(qū)塊 
document.execCommand('Cut'); 
} 
/* 
*該function用來將選中的區(qū)塊重設(shè)為一個相應(yīng)的物件 
*/ 
function fn_InsObj() 
{ 
/* 
****************************************** 
* 以下指令都是為選中的區(qū)塊重設(shè)一個object; 
* 如沒有特殊說明,第二個參數(shù)true或false是一樣的; 
* 參數(shù)三表示為該object的id; 
* 可以用在javascript中通過其指定的id來控制它 
****************************************** 
*/ 
/*重設(shè)為一個button(InsertButton和InsertInputButtong一樣, 
只不前者是button,后者是input)*/ 
/*document.execCommand('InsertButton',false,"aa"); //true或false無效 
document.all.aa.value="風(fēng)舞九天";*/ 
//重設(shè)為一個fieldset 
/*document.execCommand('InsertFieldSet',true,"aa"); 
document.all.aa.innerText="刀劍如夢";*/ 
//插入一個水平線 
//document.execCommand('InsertHorizontalRule',true,"aa"); 
//插入一個iframe 
//document.execCommand('InsertIFrame',true,"aa"); 
//插入一個InsertImage,設(shè)為true時需要圖片,false時不需圖片 
//document.execCommand('InsertImage',false,"aa"); 
//插入一個checkbox 
//document.execCommand('InsertInputCheckbox',true,"aa"); 
//插入一個file類型的object 
//document.execCommand('InsertInputFileUpload',false,"aa"); 
//插入一個hidden 
/*document.execCommand('InsertInputHidden',false,"aa"); 
alert(document.all.aa.id);*/ 
//插入一個InputImage 
/*document.execCommand('InsertInputImage',false,"aa"); 
document.all.aa.src="F-a10.gif";*/ 
//插入一個Password 
//document.execCommand('InsertInputPassword',true,"aa"); 
//插入一個Radio 
//document.execCommand('InsertInputRadio',false,"aa"); 
//插入一個Reset 
//document.execCommand('InsertInputReset',true,"aa"); 
//插入一個Submit 
//document.execCommand('InsertInputSubmit',false,"aa"); 
//插入一個input text 
//document.execCommand('InsertInputText',false,"aa"); 
//插入一個textarea 
//document.execCommand('InsertTextArea',true,"aa"); 
//插入一個 select list box 
//document.execCommand('InsertSelectListbox',false,"aa"); 
//插入一個single select 
document.execCommand('InsertSelectDropdown',true,"aa"); 
//插入一個line break(硬回車??) 
//document.execCommand('InsertParagraph'); 
//插入一個marquee 
/*document.execCommand('InsertMarquee',true,"aa"); 
document.all.aa.innerText="bbbbb";*/ 
//用于取消選中的陰影部分 
//document.execCommand('Unselect'); 
//選中頁面上的所有元素 
//document.execCommand('SelectAll'); 
} 
/* 
*該function用來將頁面保存為一個文件 
*/ 
function fn_save() 
{ 
//第二個參數(shù)為欲保存的文件名 
document.execCommand('SaveAs','mycodes.txt'); 
//打印整個頁面 
//document.execCommand('print'); 
} 
--> 
</SCRIPT> 
</HEAD> 
<body> 
<input id="edit" value="范例" NAME="edit"><br> 
<button onclick="fn_doufucopy()" ID="Button1">Copy</button> <button onclick="fn_doufupaste()" ID="Button2"> 
paste</button><br> 
<textarea id="tt" rows="10" cols="50" NAME="tt"></textarea> 
<hr> 
<br> 
浮沉聚散變化又再,但是總可卷土重來.<br> 
天若有情天亦老,人間正道是滄桑.<br> 
都怪我,太執(zhí)著,卻也等不到花開葉落.<br> 
<br> 
Please select above letters, then click following buttons:<br> 
<hr> 
<input type="button" value="創(chuàng)建CreateLink" onclick="fn_creatlink()" ID="Button3" NAME="Button3"><br> 
<input type="button" value="改變文字背景色" onclick="fn_change_backcolor()" ID="Button4" NAME="Button4"><br> 
<input type="button" value="改變文字前景色" onclick="fn_change_forecolor()" ID="Button5" NAME="Button5"><br> 
<input type="button" value="給文字加線條" onclick="fn_change_selection()" ID="Button6" NAME="Button6"><br> 
<input type="button" value="改變文字的排列" onclick="fn_format()" ID="Button7" NAME="Button7"><br> 
<input type="button" value="刪除或剪下選中的部分" onclick="fn_CutOrDel()" ID="Button8" NAME="Button8"><br> 
<input type="button" value="插入Object" onclick="fn_InsObj()" ID="Button9" NAME="Button9"><br> 
<input type="button" value="保存或打印文件" onclick="fn_save()" ID="Button10" NAME="Button10"><br> 
<input type="button" value="測試Refresh屬性" onclick="document.execCommand('Refresh')" ID="Button11" 
NAME="Button11"> 
</body> 
</HTML> 
普通的方式是激活一個<iframe>進入編輯狀態(tài)，命令如下 
IframeNamer.document.designMode="On" 
字體--宋體、黑體、楷體等 
execCommand("fontname","",字體) 
字號--字號大小 
execCommand("fontsize","",字號) 
加重 
execCommand("Bold") 
斜體 
execCommand("Italic") 
下劃線 
execCommand("Underline") 
刪除線 
execCommand("StrikeThrough") 
上標(biāo) 
execCommand("SuperScript") 
下標(biāo) 
execCommand("SubScript") 
有序排列--數(shù)字序號 
execCommand("InsertOrderedList") 
無序排列--圓點序號 
execCommand("InsertUnorderedList") 
向前縮進 
execCommand("Outdent") 
向后縮進 
execCommand("Indent") 
居左 
execCommand("JustifyLeft") 
居右 
execCommand("JustifyRight") 
居中 
execCommand("JustifyCenter") 
剪切 
execCommand("Cut") 
拷貝 
execCommand("Copy") 
粘貼 
execCommand("Paste") 
覆蓋 
execCommand("Overwrite") 
取消操作--IE5.0以后可以無限取消 
execCommand("Undo") 
重復(fù)操作 
execCommand("Redo") 
設(shè)置鏈接--若按以下寫法，在IE5.0版本中會激活一個內(nèi)建窗口，可以完成輸入鏈接的功能，而且還可以選擇MAILTO、FTP等各種鏈接類型，比較方便 
execCommand("CreateLink") 
在IE4.0中，沒有內(nèi)建鏈接輸入窗口，所以就需要用以下方式嵌入鏈接 
execCommand("CreateLink","",TURL) 
插入圖片--由于IE中嵌入的可編控件是針對本地資源的，所以其默認(rèn)的圖片資源來自本地，所以基于WEB內(nèi)容的編輯最好自己做輸入框，然后用如下命令實現(xiàn)。 
execCommand("InsertImage","",ImgURL) 
字體顏色 
execCommand("ForeColor","",CColor) 