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

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


HTML DOM कई प्रॉपर्टी रिटर्न का चयन करता है और संशोधित करता है कि ड्रॉप-डाउन सूची से कई विकल्पों का चयन किया जा सकता है या नहीं।

सिंटैक्स

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

  • एकाधिक लौट रहा है

object.multiple
  • एकाधिक को संशोधित करना

object.multiple = true | false

उदाहरण

आइए HTML DOM का एक उदाहरण देखें एकाधिक गुण चुनें -

<!DOCTYPE html>
<html>
<head>
<style>
   html{
      height:100%;
   }
   body{
      text-align:center;
      color:#fff;
      background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;
      height:100%;
   }
   p{
      font-weight:700;
      font-size:1.2rem;
   }
   .drop-down{
      width:50%;
      border:2px solid #fff;
      font-weight:bold;
      padding:8px;
      background-color:#ffffff24;
   }
   .btn{
      background:#0197F6;
      border:none;
      height:2rem;
      border-radius:2px;
      width:45%;
      margin:2rem auto;
      display:block;
      color:#fff;
      outline:none;
      cursor:pointer;
   }
   .show{
      font-size:1.1rem;
      font-weight:bold;
   }
</style>
</head>
<body>
<h1<DOM Select multiple Property Demo</h1>
<p>Hi, Select your favourite subject:</p>
<select class='drop-down'>
<option>Physics</option>
<option>Maths</option>
<option>Chemistry</option>
<option>English</option>
</select>
<button onclick="multiple()" class="btn"<Click to select multiple>/button>
<div class="show"></div>
<script>
   function multiple() {
      var dropDown = document.querySelector(".drop-down");
      var showMsg = document.querySelector(".show");
      dropDown.multiple=true;
      showMsg.innerHTML ="Now you can select multiple options using ctrl/shift" ;
   }
</script>
</body>
</html>

आउटपुट

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

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

एकाधिक चुनने के लिए क्लिक करें . पर क्लिक करें ड्रॉप-डाउन सूची में एकाधिक विकल्पों का चयन करने के लिए बटन।

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


  1. एचटीएमएल डोम सामग्री संपादन योग्य संपत्ति है

    HTML DOM isContentEditable प्रॉपर्टी लौटाता है कि किसी तत्व की सामग्री को संशोधित किया जा सकता है या नहीं। सिंटैक्स निम्नलिखित वाक्य रचना है - बूलियन मान लौटाना - सही/गलत HTMLElementObject.isContentEditable बूलियन मान यहां, “बूलियनवैल्यू” लौटाया जाता है - booleanValue विवरण सच यह परिभाषित करता

  1. HTML DOM lastModified संपत्ति

    HTML DOM lastModified प्रॉपर्टी वर्तमान दस्तावेज़ को अंतिम बार संशोधित करने का दिनांक और समय लौटाती है। सिंटैक्स निम्नलिखित वाक्य रचना है - लौटने की तारीख और समय - document.lastModified उदाहरण आइए HTML DOM lastModified . के लिए एक उदाहरण देखें संपत्ति - <!DOCTYPE html> <html> <head

  1. HTML DOM lastChild प्रॉपर्टी

    HTML DOM lastChild गुण अंतिम तत्व नोड को निर्दिष्ट नोड के नोड ऑब्जेक्ट के रूप में लौटाता है। नोट - यह प्रॉपर्टी टेक्स्ट और कमेंट नोड्स को नज़रअंदाज़ नहीं करती है सिंटैक्स निम्नलिखित वाक्य रचना है - लास्टचाइल्ड नोड लौटा रहा है nodeList.lastChild उदाहरण आइए HTML DOM lastChild . के लिए एक उदाहरण दे