HTML DOM execCommand() मेथड

HTML DOM execCommand() मेथड का उपयोग यूज़र द्वारा चुने गए संपादन योग्य अनुभाग पर निर्दिष्ट कमांड को एक्ज़िक्यूट करने के लिए किया जाता है। सबसे पहले document.design प्रॉपर्टी को सेट किया जाना चाहिए ताकि पहले स्थान पर एक संपादन योग्य अनुभाग हो।

सिंटैक्स

execCommand() मेथड के लिए सिंटैक्स:

document.execCommand(command, showUI, value)

यहां, value कुछ विशिष्ट कमांड के लिए है जिन्हें पूरा करने की आवश्यकता होती है, जैसे fontSize, forecolor, आदि। showUI एक बूलियन मान है जो निर्दिष्ट करता है कि मान दिखाया जाना चाहिए या नहीं। command name वह कमांड है जिसे संपादन योग्य अनुभाग पर एक्ज़िक्यूट करने की आवश्यकता है।

command पैरामीटर के लिए निम्नलिखित मान हैं:

"backColor", "bold", "createLink", "copy", "cut", "defaultParagraphSeparator", "delete", "fontName", "fontSize", "foreColor", "formatBlock", "forwardDelete", "insertHorizontalRule", "insertHTML", "insertImage", "insertLineBreak", "insertOrderedList", "insertParagraph", "insertText", "insertUnorderedList", "justifyCenter", "justifyFull", "justifyLeft", "justifyRight", "outdent", "paste", "redo", "selectAll", "strikethrough", "styleWithCss", "superscript", "undo", "unlink", "useCSS"

उदाहरण

आइए execCommand() मेथड का एक उदाहरण देखते हैं:

<!DOCTYPE html> <html> <body ondblclick="changeText()"> 
<h1>execCommand() मेथड उदाहरण</h1> 
<h3>किसी भी टेक्स्ट पर डबल क्लिक करके उसका फॉन्ट साइज और रंग बदलें</h3> 
<p>यहाँ क्लिक करने के लिए कुछ टेक्स्ट है। यहाँ भी कुछ नमूना टेक्स्ट है</p> 
<script> 
  document.designMode = "on"; 
  function changeText() { 
    document.execCommand("fontSize", true, "20px"); 
    document.execCommand("backColor", true, "lightgreen"); 
    document.execCommand("foreColor", true, "blue"); 
  } 
</script> </body> </html>

आउटपुट

यह निम्नलिखित आउटपुट देगा:

HTML DOM execCommand() मेथड

पेज पर किसी टेक्स्ट पर डबल क्लिक करने पर, उस विशेष टेक्स्ट का फॉर्मेटिंग बदल जाएगा:

HTML DOM execCommand() मेथड

उदाहरण की व्याख्या

उपरोक्त उदाहरण में:

हमने पहले अपने दस्तावेज़ बॉडी के लिए डबल क्लिक इवेंट के लिए एक इवेंट हैंडलर जोड़ा। बॉडी के किसी भी चाइल्ड पर डबल क्लिक करने पर, यह changeText() मेथड को एक्ज़िक्यूट करेगा। यहां बॉडी चाइल्ड h1, h3 और p तत्व हैं:

<body ondblclick="changeText()">

हम पहले document design mode को on पर सेट करते हैं ताकि हम अपने दस्तावेज़ को संपादित कर सकें। फंक्शन changeText() document के execCommand() मेथड को एक्ज़िक्यूट करता है और इसके पैरामीटर्स जैसे fontSize, backColor, foreColor को उनके संबंधित मानों के साथ पास करता है। ये मान यूज़र द्वारा डबल क्लिक किए गए संपादन योग्य अनुभाग पर लागू होंगे:

function changeText() { 
  document.execCommand("fontSize", true, "20px"); 
  document.execCommand("backColor", true, "lightgreen"); 
  document.execCommand("foreColor", true, "blue"); 
}