एचटीएमएल डोम स्टाइल उपयोगकर्ता संपत्ति का चयन करें

HTML DOM स्टाइल यूजर प्रॉपर्टी रिटर्न का चयन करें और संशोधित करें कि किसी एलिमेंट का टेक्स्ट यूजर द्वारा चुना जा सकता है या नहीं, HTML डॉक्यूमेंट में।

सिंटैक्स

निम्नलिखित वाक्य रचना है -

लौटने वाले उपयोगकर्ता का चयन करें

object.style.userSelect

उपयोगकर्ता को संशोधित करना चुनें

object.style.userSelect = “value”

मान

यहाँ, मान हो सकता है -

मान	स्पष्टीकरण
स्वतः	यह उपयोगकर्ता को ब्राउज़र सेटिंग के अनुसार टेक्स्ट चुनने की अनुमति देता है।
कोई नहीं	यह उपयोगकर्ता को टेक्स्ट चुनने की अनुमति नहीं देता है।
पाठ	इसमें उपयोगकर्ता द्वारा टेक्स्ट का चयन किया जा सकता है।
सभी	यह डबल क्लिक के बजाय सिंगल क्लिक के साथ टेक्स्ट चयन की अनुमति देता है।

उदाहरण

आइए HTML DOM स्टाइल यूजर सेलेक्ट प्रॉपर्टी का एक उदाहरण देखें -

<!DOCTYPE html>
<html>
<head>
<style>
   body {
      color: #000;
      background: lightblue;
      height: 100vh;
   }
   .btn {
      background: #db133a;
      border: none;
      height: 2rem;
      border-radius: 2px;
      width: 40%;
      display: block;
      color: #fff;
      outline: none;
      cursor: pointer;
   }
   .show {
      margin: 1rem 0;
   }
</style>
</head>
<body>
<h1>DOM Style userSelect Property Example</h1>
<p style="direction:ltr">This is a paragraph element with some dummy text.</p>
<button onclick="add()" class="btn">Set userSelect</button>
<div class="show"></div>
<script>
   function add() {
      document.querySelector('p').style.userSelect = "none";
      document.querySelector('.show').innerHTML = "Now you can't select the above paragraph text";
   }
</script>
</body>
</html>

आउटपुट

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

एचटीएमएल डोम स्टाइल उपयोगकर्ता संपत्ति का चयन करें

“उपयोगकर्ता चयन सेट करें . पर क्लिक करें "उपयोगकर्ता सेट करने के लिए बटन पैराग्राफ तत्व पर मूल्य के रूप में कोई भी नहीं चुनें।

एचटीएमएल डोम स्टाइल उपयोगकर्ता संपत्ति का चयन करें