HTML DOM शैली दृश्यता गुण लौटाता है और संशोधित करता है कि कोई तत्व HTML दस्तावेज़ में दिखाई देना चाहिए या नहीं।
सिंटैक्स
निम्नलिखित वाक्य रचना है -
-
वापसी दृश्यता
object.style.visibility
-
दृश्यता संशोधित करना
object.style.visibility = “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; margin: 1rem 0; } </style> </head> <body> <h1>DOM Style visibility Property Example</h1> <p>I'm paragraph element with some dummy text</p> <button onclick="add()" class="btn">Set visibility</button> <script> function add() { document.querySelector('p').style.visibility = "hidden"; } </script> </body> </html>
आउटपुट
यह निम्नलिखित आउटपुट देगा -
“दृश्यता सेट करें . पर क्लिक करें अनुच्छेद तत्व पर मूल्य के रूप में छिपे हुए दृश्यता को सेट करने के लिए बटन -