एचटीएमएल डोम टेबल ऑब्जेक्ट

<घंटा/>

HTML DOM तालिका ऑब्जेक्ट HTML दस्तावेज़ के

तत्व का प्रतिनिधित्व करता है।

आइए देखें कि टेबल ऑब्जेक्ट कैसे बनाया जाता है

सिंटैक्स

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

document.createElement(“TABLE”);

गुण

टेबल ऑब्जेक्ट के गुण निम्नलिखित हैं -

तत्व को लौटाता है। तत्व को लौटाता है।

तत्व देता है।
संपत्ति	स्पष्टीकरण
कैप्शन	यह HTML दस्तावेज़ में तालिका का
tफुट	यह HTML दस्तावेज़ में तालिका के
टीहेड	यह HTML दस्तावेज़ में तालिका के

तरीके

टेबल ऑब्जेक्ट की विधियाँ निम्नलिखित हैं -

तत्व उत्पन्न करता है और इसे तालिका में जोड़ता है। तत्व उत्पन्न करता है और इसे तालिका में जोड़ता है। तत्व को हटाता है। तत्व को हटा देता है। तत्व को हटा देता है। तत्व उत्पन्न करता है और इसे तालिका में जोड़ता है।

तत्व उत्पन्न करता है और इसे तालिका में जोड़ता है।
विधि	स्पष्टीकरण
क्रिएटकैप्शन ()	यह एक खाली
createTFoot()	यह एक खाली
createTHhead()	यह एक खाली
डिलीट कैप्शन ()	यह तालिका से पहला
deleteRow()	यह तालिका से
deleteThead()	यह तालिका से
deleteTFoot()	यह तालिका से
insertRow()	यह एक खाली

उदाहरण

आइए टेबल ऑब्जेक्ट का एक उदाहरण देखें -

<!DOCTYPE html>
<html>
<head>
<style>
   body {
      text-align: center;
      background-color: #fff;
      color: #0197F6;
   }
   h1 {
      color: #23CE6B;
   }
   .btn {
      background-color: #fff;
      border: 1.5px dashed #0197F6;
      height: 2rem;
      border-radius: 2px;
      width: 60%;
      margin: 2rem auto;
      display: block;
      color: #0197F6;
      outline: none;
      cursor: pointer;
   }
</style>
</head>
<body>
<h1>DOM table Object Demo</h1>
<button onclick="createTable()" class="btn">Create a table object</button>
<script>
   function createTable() {
      var table = document.createElement("TABLE");
      table.innerHTML = `<tr>
      <td>Data 1</td>
      <td>Data 2</td>
      </tr>
      <tr>
      <td>Data 3</td>
      <td>Data 4</td>
      </tr>`;
      table.setAttribute('border', "2");
      table.style.margin = "2rem auto";
      document.body.appendChild(table);
   }
</script>
</body>
</html>

आउटपुट

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

एचटीएमएल डोम टेबल ऑब्जेक्ट

“टेबल ऑब्जेक्ट बनाएं . पर क्लिक करें “टेबल ऑब्जेक्ट बनाने के लिए बटन।

एचटीएमएल डोम टेबल ऑब्जेक्ट