Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> Javascript

जावास्क्रिप्ट का उपयोग करके किसी तत्व के अंदर टेक्स्ट का चयन और चयन रद्द करें


जावास्क्रिप्ट का उपयोग करके किसी तत्व के अंदर टेक्स्ट को चुनने और अचयनित करने के लिए निम्नलिखित कोड है -

उदाहरण

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result {
      font-size: 20px;
      font-weight: 500;
   }
</style>
</head>
<body>
<h1>Select and Deselect Text Inside an Element</h1>
<div style="color: green;" class="result">
Here is some text inside the div
</div>
<button class="Btn">SELECT</button>
<button class="Btn">DESELECT</button>
<h3>Click on the above button to select/de-select text inside the div</h3>
<script>
   let resEle = document.querySelector(".result");
   let BtnEle = document.querySelectorAll(".Btn");
   BtnEle[0].addEventListener("click", () => {
      window.getSelection().selectAllChildren(resEle);
   });
   BtnEle[1].addEventListener("click", () => {
      window.getSelection().removeAllRanges();
   });
</script>
</body>
</html>

आउटपुट

उपरोक्त कोड निम्न आउटपुट उत्पन्न करेगा -

जावास्क्रिप्ट का उपयोग करके किसी तत्व के अंदर टेक्स्ट का चयन और चयन रद्द करें

'सेलेक्ट' बटन पर क्लिक करने पर -

जावास्क्रिप्ट का उपयोग करके किसी तत्व के अंदर टेक्स्ट का चयन और चयन रद्द करें

'चुनें' बटन पर क्लिक करने पर -

जावास्क्रिप्ट का उपयोग करके किसी तत्व के अंदर टेक्स्ट का चयन और चयन रद्द करें


  1. जावास्क्रिप्ट वाले वेब पेज पर कोई भी टेक्स्ट जो एलिमेंट टैग के अंदर नहीं है, उसे हटा दें?

    पाठ को हटाने के लिए, निकालें () की अवधारणा का उपयोग करें। सामग्री को तत्व टैग के अंदर नहीं लाने के लिए फ़िल्टर का उपयोग करें। मान लें कि निम्नलिखित हमारा HTML है - डेमो प्रोग्रामयह भी डेमो प्रोग्राम है और हमें यह भी डेमो प्रोग्राम है को हटाना होगा क्योंकि यह एलिमेंट टैग के अंतर्गत नहीं है। उसके लिए

  1. क्या जावास्क्रिप्ट के साथ टेक्स्ट बॉक्स चुनना संभव है?

    हां, चयन () पद्धति का उपयोग करके जावास्क्रिप्ट के साथ टेक्स्ट बॉक्स का चयन करें। सबसे पहले, हम एक इनपुट टेक्स्ट बनाते हैं - Enter your Name:<input type="text" id="txtName" value="John"> <br> <button type="button" onclick="check()">S

  1. CSS का उपयोग करके किसी तत्व की न्यूनतम-चौड़ाई और अधिकतम-चौड़ाई सेट करें

    किसी तत्व की न्यूनतम और अधिकतम चौड़ाई निर्धारित करने के लिए, आप निम्न कोड को चलाने का प्रयास कर सकते हैं उदाहरण <!DOCTYPE html> <html>    <head>       <style>          div {             max-width: