HTML DOM टेबल deleteTHead() मेथड: टेबल हेडर हटाना

HTML DOM टेबल deleteTHead() मेथड HTML दस्तावेज़ में टेबल से <thead> एलिमेंट हटाता है।

सिंटैक्स

object.deleteTHead()

उदाहरण: टेबल हेडर हटाना

<!DOCTYPE html>
<html>
<style>
  body { color: #000; background: lightblue; height: 100vh; text-align: center; }
  table { margin: 2rem auto; }
  caption { color: #db133a; }
  .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; margin: 1rem auto; }
  .show { font-size: 1.2rem; }
</style>
<body>
  <h1>DOM टेबल deleteTHead() मेथड डेमो</h1>
  <table border="2">
    <thead>
      <tr> <th>नाम</th> <th>रोल नं.</th> </tr>
    </thead>
    <tbody>
      <tr> <td>जॉन</td> <td>071717</td> </tr>
      <tr> <td>जेन</td> <td>031717</td> </tr>
    </tbody>
  </table>
  <button onclick="remove()" class="btn">हेडर हटाएं</button>
  <script>
    function remove() {
      var tableFooter = document.querySelector('table').deleteTHead();
    }
  </script>
</body>
</html>

आउटपुट

1. प्रारंभ में: टेबल में हेडर पंक्ति ("नाम", "रोल नं.") दिखती है
2. "हेडर हटाएं" क्लिक: पूरा <thead> सेक्शन हटा दिया जाता है
3. परिणाम: केवल डेटा पंक्तियां शेष रहती हैं

महत्वपूर्ण बिंदु

• कोई पैरामीटर नहीं: पूरी <thead> हटाता है
• यदि thead नहीं है: कुछ नहीं करता (कोई त्रुटि नहीं)
• केवल पहला thead: HTML में केवल एक <thead> अनुमत है
• वापसी मान: हटाया गया <thead> एलिमेंट (या null)

संबंधित मेथड्स

उपयोग का मामला

डायनामिक टेबल्स में जहां हेडर को पूरी तरह से बदलने की आवश्यकता हो, पुराने हेडर को हटाकर नया createTHead() से बनाना बेहतर है बजाय आंतरिक HTML मैनिपुलेट करने के।