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

JavaScript का उपयोग करके एलिमेंट के अंदर टेक्स्ट सिलेक्ट और डीसिलेक्ट करना


JavaScript का उपयोग करके एलिमेंट के अंदर टेक्स्ट सिलेक्ट और डीसिलेक्ट करने का निम्नलिखिक कोड है:

उदाहरण

<!DOCTYPE html> <html lang="hi"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Select Deselect Text</title> <style> body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 20px; font-weight: 500; } </style> </head> <body> <h1>एलिमेंट के अंदर टेक्स्ट सिलेक्ट और डीसिलेक्ट करें</h1> <div style="color: green;" class="result"> यहाँ डिव के अंदर कुछ टेक्स्ट है </div> <button class="Btn">सिलेक्ट करें</button> <button class="Btn">डीसिलेक्ट करें</button> <h3>डिव के अंदर टेक्स्ट सिलेक्ट/डी-सिलेक्ट करने के लिए ऊपर दिए गए बटन पर क्लिक करें</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>

आउटपुट

उपरोक्त कोड निम्नलिखिक आउटपुट देगा:

JavaScript का उपयोग करके एलिमेंट के अंदर टेक्स्ट सिलेक्ट और डीसिलेक्ट करना

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

JavaScript का उपयोग करके एलिमेंट के अंदर टेक्स्ट सिलेक्ट और डीसिलेक्ट करना

'डीसिलेक्ट करें' बटन पर क्लिक करने पर:

JavaScript का उपयोग करके एलिमेंट के अंदर टेक्स्ट सिलेक्ट और डीसिलेक्ट करना


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

    टेक्स्ट हटाने के लिए, remove() की अवधारणा का उपयोग करें। एलिमेंट टैग के अंदर नहीं होने वाले कंटेंट को प्राप्त करने के लिए फिल्टर का उपयोग करें।मान लीजिए निम्नलिखित हमारा HTML है -Demo Program This is also Demo Programऔर हमें This is also Demo Program हटाना है क्योंकि यह एलिमेंट टैग के तहत नहीं है। इ

  1. क्या JavaScript से टेक्स्ट बॉक्स को सेलेक्ट करना संभव है? क्या JavaScript से टेक्स्ट बॉक्स को सेलेक्ट करना संभव है?

    हां, JavaScript में select() मेथड का उपयोग करके टेक्स्ट बॉक्स (इनपुट फ़ील्ड) का टेक्स्ट प्रोग्रामेटिकली सेलेक्ट कर सकते हैं। बुनियादी उदाहरण <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <meta name=viewport content=width=device-width, initial-scale=1.

  1. CSS से एलिमेंट की min-width और max-width सेट करें CSS से एलिमेंट की min-width और max-width सेट करें

    min-width और max-width प्रॉपर्टीज min-width और max-width प्रॉपर्टीज का उपयोग किसी एलिमेंट की न्यूनतम और अधिकतम चौड़ाई सीमित करने के लिए किया जाता है। यह फ्लूइड लेआउट्स में एलिमेंट को बहुत संकरा या बहुत चौड़ा होने से रोकता है। उदाहरण <!DOCTYPE html> <html> <head> <style>