IE execCommand() 의 명령어 목록 | JavaScript

태그::스크립트

2007/02/16 03:49

2D-Position 항상 드래그로 위치된 엘레멘트의 이동시킬 수 있다.
AbsolutePosition 엘레멘트의 위치(position)를 절대위치(absolute)로 설정한다.
BackColor 현재 선택의 배경색을 지정하거나 반환한다.
Bold 현재의 선책을 굵은 글자(bold)나 굵지않은 글자로 전환한다.
ClearAuthenticationCache 캐쉬(cache)의 모든 내용을 지운다. execCommand에서만 사용이 가능하다.
Copy 현재의 선택한 내용을 클립보드로 복사한다.
CreateBookmark 현재 선택이나 삽입 포인트의 anchor 혹은 북마크의 상대 이름 앤커로 북파크(bookmark)를 생성한다.
CreateLink 현재 선택에 주소 연결(hyperlink)을 삽입하거나, 주소를 입력하여 삽입할 수 있는 대화창을 열어준다.
Cut 현재의 선택한 내용을 클립보드로 복사하고 선택 내용을 지운다.
Delete 현재 선택을 삭제한다.
FontName 현재 선택의 글꼴을 지정하거나 반환한다.
FontSize 현재 선택의 글꼴 크기를 지정하거나 반환한다.
ForeColor 현재 선택의 글꼴 색상(foreground)을 지정하거나 반환한다.
FormatBlock 현재 블럭의 태그를 설정한다.
Indent 현재 선택 문자를 한 증가분 만큼 뒤로 들여쓰기 한다.
InsertButton 사용자나 메서드에 의하여 선택된 단추(button)의 보이는 내용을 삽입한다. selection 개체 createRange 메서드를 사용하여 선택한 문자를 반환하거나 설정할 수 있다.
InsertFieldset 문자 선택(text selection)의 박스를 삽입한다.
InsertHorizontalRule 문자 선택(text selection)의 수평선(HR)을 합입한다.
InsertIFrame 문자 선택(text selection)의 인라인 프레임(IFRAME)을 삽입한다.
InsertImage 문자 선택(text selection)의 이미지(IMAGE)를 삽입한다.
InsertInputButton 문자 선택(text selection)의 단추(BUTTON)를 삽입한다.
InsertInputCheckbox 문자 선택(text selection)의 체크박스(CHECKBOX)를 삽입한다.
InsertInputFileUpload 문자 선택(text selection)의 파일업로드(FileUpload)를 삽입한다.
InsertInputHidden 문자 선택(text selection)의 감춘단추(HIDDEN)를 삽입한다.
InsertInputImage 문자 선택(text selection)의 이미지(IMAGE) 제어를 덮어씌우기한다.
InsertInputPassword 문자 선택(text selection)의 암호(PASSWORD) 제어를 덮어씌우기한다.
InsertInputRadio 문자 선택(text selection)의 레디오단추(RADIO) 제어를 덮어씌우기한다.
InsertInputReset 문자 선택(text selection)의 재설정(RESET) 제어를 덮어씌우기한다.
InsertInputSubmit 문자 선택(text selection)의 송신(SUBMIT) 제어를 덮어씌우기한다.
InsertInputText 문자 선택(text selection)의 문자열입력(TEXT) 제어를 덮어씌우기한다..
InsertMarquee 문자 선택(text selection)의 빈 마퀴(MARQUEE)를 덮어씌우기한다..
InsertOrderedList 문자 선택(text selection)의 번호있는 목록(OL)과 보통 블럭간의 전환을 한다.
InsertParagraph 문자 선택(text selection)의 줄바꿈(BR)을 덮어씌우기한다.
InsertSelectDropdown 문자 선택(text selection)의 드롭다운 제어를 덮어씌우기한다.
InsertSelectListbox 문자 선택(text selection)의 목록박스 선택 제어를 덮어씌우기한다.
InsertTextArea 문자 선택(text selection)의 여러 줄 텍스트 입력 제어를 덮어씌운다..
InsertUnorderedList 문자 선택(text selection)을 번호있는 목록과 일반 블럭 양식을 서로 교차시킨다.
Italic 문자 선택(text selection)에서 이태릭(italic) 문자와 보통 문자간 전환한다.
JustifyCenter 문자 선택(text selection)이 위치한 불럭에서 중앙에 위치시킨다.
JustifyLeft 문자 선택(text selection)이 위치한 불럭에서 왼똑에 위치시킨다.
JustifyRight 문자 선택(text selection)이 위치한 불럭에서 오른쪽에 위치시킨다.
LiveResize 위치 변경과 크기 변경에 따라 업데이트 뿐 아니라, 과정 중 계속적으로 모양을 유지위하기 업데이트를 한다.
MultipleSelection 예를 들어 편집기의 이미지와 제어를 하나의 엘레멘트처럼, 한개 이상의 엘레멘트를 선택할 수 있게 허용한다. 지명적이거나 암시적으로 속성이 지정된 엘레멘트는 한번에 SHIFT 나 CTRL로 선택될 수 있다.
Outdent 문자 선택(text selection)의 현위치에서 들어쓰기 한 증가분 만큼 왼쪽으로 내어쓰기 한다.
OverWrite 문자 입력 방식과 덮어쒸우기 방식 사이를 전환한다.
Paste 문자 선택(text selection)을 클립보드 내용으로 덮어씌우기 한다.
Print 사용자가 편재의 문서를 인쇄할 수 있도록 인쇄 대화상자를 열어 준다.
Refresh 현재의 문서를 새로고침 한다..
RemoveFormat 현재 선택 문자로 부터 태그들을 제거한다.
SaveAs 현재의 문서를 파일로 저장한다.
SelectAll 전체 문서를 선택한다.
UnBookmark 현재의 선택으로부터 북마크의 어떤 내용을 삭제한다.
Underline 현재 선택 문자에서 밑줄 그어진 부분과 밑줄 없는 부분 사이를 전환한다.
Unlink 현재 선택 문자에서 모든 연결을 삭제한다.
Unselect 현재 선택 문자을 취소한다.



Mozilla execCommand() 명령어 목록


command value explanation / behavior
backcolor ???? This command will set the background color of the document.
bold none If there is no selection, the insertion point will set bold for subsequently typed characters.

If there is a selection and all of the characters are already bold, the bold will be removed.  Otherwise, all selected characters will become bold.
contentReadOnly true
false
This command will make the editor readonly (true) or editable (false).  Anticipated usage is for temporarily disabling input while something else is occurring elsewhere in the web page.
copy none If there is a selection, this command will copy the selection to the clipboard.  If there isn't a selection, nothing will happen.

note: this command won't work without setting a pref or using signed JS.  See: http://www.mozilla.org/editor/midasdemo/securityprefs.html

note:  the shortcut key will automatically trigger this command (typically accel-C) with or without the signed JS or any code on the page to handle it.
createlink url (href) This command will not do anything if no selection is made.  If there is a selection, a link will be inserted around the selection with the url parameter as the href of the link.
cut none If there is a selection, this command will copy the selection to the clipboard and remove the selection from the edit control.  If there isn't a selection, nothing will happen.

note: this command won't work without setting a pref or using signed JS.  See: http://www.mozilla.org/editor/midasdemo/securityprefs.html

note:  the shortcut key will automatically trigger this command (typically accel-X) with or without the signed JS or any code on the page to handle it.
decreasefontsize none This command will add a <small> tag around selection or at insertion point.
delete none This command will delete all text and objects that are selected.
fontname ???? This command will set the fontface for a selection or at the insertion point if there is no selection.
fontsize ???? This command will set the fontsize for a selection or at the insertion point if there is no selection.
forecolor ???? This command will set the text color of the selection or at the insertion point.
formatblock <h1>
<h2>
<h3>
<h4>
<h5>
<h6>
<pre>
<address>
<p>
p
[this list may not be complete]

heading <h1>
<h2>
<h3>
<h4>
<h5>
<h6>

hilitecolor ???? This command will set the hilite color of the selection or at the insertion point.  It only works with usecss enabled.
increasefontsize none This command will add a <big> tag around selection or at insertion point.
indent none Indent the block where the caret is located.
inserthorizontalrule none This command will insert a horizontal rule (line) at the insertion point.

Does it delete the selection?
inserthtml valid html string This command will insert the given html into the <body> in place of the current selection or at the caret location.
insertimage url (src) This command will insert an image (referenced by url) at the insertion point.

Does it delete the selection?
insertorderedlist none
insertunorderedlist none
insertparagraph none
italic none If there is no selection, the insertion point will set italic for subsequently typed characters.  

If there is a selection and all of the characters are already italic, the italic will be removed.  Otherwise, all selected characters will become italic.
justifycenter none
justifyfull none
justifyleft none
justifyright none
outdent none Outdent the block where the caret is located.  If the block is not indented prior to calling outdent, nothing will happen.

note:  is an error thrown if no outdenting is done?
paste none This command will paste the contents of the clipboard at the location of the caret.  If there is a selection, it will be deleted prior to the insertion of the clipboard's contents.

note: this command won't work without setting a pref or using signed JS.
user_pref("capability.policy.policynames", "allowclipboard"); user_pref("capability.policy.allowclipboard.Clipboard.paste", "allAccess");
See: http://www.mozilla.org/editor/midasdemo/securityprefs.html

note:  the shortcut key will automatically trigger this command (typically accel-V) with or without the signed JS or any code on the page to handle it.
redo none This command will redo the previous undo action.  If undo was not the most recent action, this command will have no effect.

note:  the shortcut key will automatically trigger this command (typically accel-shift-Z)
removeformat none
selectall none This command will select all of the contents within the editable area.

note:  the shortcut key will automatically trigger this command (typically accel-A)
strikethrough none If there is no selection, the insertion point will set strikethrough for subsequently typed characters.

If there is a selection and all of the characters are already striked, the strikethrough will be removed. Otherwise, all selected characters will have a line drawn through them.
styleWithCSS true
false
This command is used for toggling the format of generated content.  By default (at least today), this is true.  An example of the differences is that the "bold" command will generate <b> if the styleWithCSS command is false and generate css style attribute if the styleWithCSS command is true.
subscript none If there is no selection, the insertion point will set subscript for subsequently typed characters.  

If there is a selection and all of the characters are already subscripted, the subscript will be removed.  Otherwise, all selected characters will be drawn slightly lower than normal text.
superscript none If there is no selection, the insertion point will set superscript for subsequently typed characters.

If there is a selection and all of the characters are already superscripted, the superscript will be removed.  Otherwise, all selected characters will be drawn slightly higher than normal text.
underline none If there is no selection, the insertion point will set underline for subsequently typed characters.

If there is a selection and all of the characters are already underlined, the underline will be removed.  Otherwise, all selected characters will become underlined.
undo none This command will undo the previous action.  If no action has occurred in the document, then this command will have no effect.

note:  the shortcut key will automatically trigger this command (typically accel-Z)
unlink none

DEPRECATED COMMANDS
readonly true
false
This command has been replaced with contentReadOnly.  It takes the same values as contentReadOnly, but the meaning of true and false are inversed.
useCSS truefalse This command has been replaced with styleWithCSS.  It takes the same values as styleWithCSS, but the meaning of true and false are inversed.

출처 : Tong - heart2heart님의 web개발통




단... 위사항들은 IE7에서는 제한된다는... 사실... -_-;;;

<HTML>
<BODY>
<b>
  <font color="maroon" unselectable="on">문자열 중 원하는 부분 선택 후 아래 버튼 클릭!</font>
</b>
<script language='JavaScript'>
<!--
function AddLink() {
  /*******************************************************************
    사용자가 선택한 문자열을 변수로 저장한다.
  *******************************************************************/
  var sText = document.selection.createRange();
  if (!sText==""){
    /*******************************************************************
      "하이퍼링크" 메뉴를 실행시킨다.
    *******************************************************************/
    document.execCommand("CreateLink");
    /*******************************************************************
      sText.parentElement()는 사용자가 선택한 문자열에 대한 패런트 요소를 얻어 온다.
      이미 "하이퍼링크" 대화 상자에서 입력한 값이 이 요소에 반영되었으므로,
      이 값의 tagName 속성이 "A"일 경우 계속 진행한다.
    *******************************************************************/
    if (sText.parentElement().tagName == "A"){
      /*******************************************************************
        사용자가 선택한 문자열의 내용을 새로 추가시킨 하이퍼링크 주소로 대치시킨다.
        만일 이 코드를 주석으로 막으면 사용자가 선택한 문자열에 하이퍼 링크 속성만 추가된다.     
      *******************************************************************/
      sText.parentElement().innerText=sText.parentElement().href;
      /*******************************************************************
        전경색을 "maroon" 색으로 변경시킨다.
      *******************************************************************/
      document.execCommand("ForeColor","false","maroon");
    }   
  }
  else{
    alert("문자열의 일부를 선택한 후 이 버튼을 클릭하세요!");
  }
}
//-->
</script>
<p style="color=blue">
사용자가 선택한 문자열 중 원하는 부분 선택 후 아래 버튼을 클릭하면,
링크를 만들수 있습니다.
</p>
<BUTTON onclick="AddLink()" unselectable="on">링크 만들기</BUTTON>
</BODY>
</HTML>



document.execCommand 에 대해서 좀더 알아봐야 겠다. 쩝...



출처 : http://tong.nate.com/heart2heart/34130212

+ Recent posts