HTML DOM Style emptyCells प्रॉपर्टी

परिचय

HTML DOM Style emptyCells प्रॉपर्टी का उपयोग यह निर्दिष्ट करने के लिए किया जाता है कि टेबल के खाली सेल कैसे प्रदर्शित किए जाएं। डिफ़ॉल्ट रूप से, यह प्रॉपर्टी show पर सेट होती है।

सिंटैक्स

empty-cells: show|hide|initial|inherit;

यहां, "show" खाली सेल्स पर बॉर्डर प्रदर्शित करता है जबकि "hide" नहीं करता। "initial" इसे डिफ़ॉल्ट मान पर सेट करता है और "inherit" पैरेंट प्रॉपर्टी मान विरासत में लेता है।

उदाहरण

<!DOCTYPE html>
<html>
<head>
<style>
  #TABLE1 {
    font-style: italic;
    empty-cells: hide;
  }
  table, td {
    margin: 5px;
    padding: 3px;
    border: 1px solid black;
  }
</style>
<script>
  function showEmptyCells() {
    document.getElementById("TABLE1").style.emptyCells = "show";
    document.getElementById("Sample").innerHTML = "टेबल के खाली सेल अब दिखाई देंगे";
  }
</script>
</head>
<body>
  <table id="TABLE1">
    <tr>
      <td>demo</td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td>demo</td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td>demo</td>
      <td></td>
      <td></td>
    </tr>
  </table>
  <p>ऊपर की टेबल के छिपे हुए सेल्स दिखाने के लिए नीचे दिए गए बटन पर क्लिक करें</p>
  <button onclick="showEmptyCells()">सेल्स दिखाएं</button>
  <p id="Sample"></p>
</body>
</html>

आउटपुट

प्रारंभिक स्थिति (खाली सेल्स छिपे हुए):

"सेल्स दिखाएं" बटन पर क्लिक करने के बाद: