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

एचटीएमएल डोम टेबलडेटा कॉलस्पैन संपत्ति

<घंटा/>

HTML DOM TableData colSpan गुण किसी HTML दस्तावेज़ में तालिका के colspan विशेषता के मान को लौटाता है और संशोधित करता है।

सिंटैक्स

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

<मजबूत>1. colSpan लौट रहा है

object.colSpan

<मजबूत>2. colSpan जोड़ना

object.colSpan = “number”

आइए हम colSpan गुण का एक उदाहरण देखें -

उदाहरण

<!DOCTYPE html>
<html>
<style>
   body {
      color: #000;
      background: lightblue;
      height: 100vh;
      text-align: center;
   }
   table {
      margin: 2rem auto;
      width: 400px;
   }
   .btn {
      background: #db133a;
      border: none;
      height: 2rem;
      border-radius: 2px;
      width: 40%;
      display: block;
      color: #fff;
      outline: none;
      cursor: pointer;
      margin: 1rem auto;
   }
</style>
<body>
<h1>DOM TableData colSpan Property Demo</h1>
<table border="2">
<thead>
<tr>
<th>Name</th>
<th>Roll No.</th>
</tr>
<thead>
<tbody>
<tr>
<td>John</td>
<td>071717</td>
</tr>
<tr>
<td>Jane</td>
<td>031717</td>
</tr>
</tbody>
<tfoot>
<tr>
<td id="span-row">Table Footer</td>
</tr>
</tfoot>
</table>
<button onclick="get()" class="btn">Span Footer</button>
<script>
   function get() {
      document.querySelector('#span-row').colSpan = "2";
   }
</script>
</body>
</html>

आउटपुट

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

एचटीएमएल डोम टेबलडेटा कॉलस्पैन संपत्ति

स्पैन फूटर . पर क्लिक करें तालिका के पादलेख को दो स्तंभों में फैलाने के लिए बटन।

एचटीएमएल डोम टेबलडेटा कॉलस्पैन संपत्ति


  1. एचटीएमएल डोम टेबल टीहेड संपत्ति

    HTML DOM तालिका tHead गुण HTML दस्तावेज़ में तालिका के तत्व को लौटाता है। सिंटैक्स निम्नलिखित वाक्य रचना है - object.tHead आइए HTML DOM तालिका tHead गुण का एक उदाहरण देखें - उदाहरण <!DOCTYPE html> <html> <style>    body {       color: #000;    

  1. एचटीएमएल डोम टेबल tfoot संपत्ति

    HTML DOM तालिका tfoot गुण HTML दस्तावेज़ में तालिका के तत्व को लौटाता है। सिंटैक्स निम्नलिखित वाक्य रचना है - object.tFoot आइए हम HTML DOM तालिका tFoot गुण का एक उदाहरण देखें - उदाहरण <!DOCTYPE html> <html> <style>    body {       color: #000;   &nb

  1. एचटीएमएल डोम स्टाइल कैप्शनसाइड प्रॉपर्टी

    HTML DOM कैप्शनसाइड प्रॉपर्टी का उपयोग टेबल कैप्शन पोजीशन प्राप्त करने या सेट करने के लिए किया जाता है। टेबल कैप्शन केवल वर्टिकल पोजीशन यानी ऊपर और नीचे सेट होता है। − . के लिए वाक्य रचना निम्नलिखित है कैप्शन साइड प्रॉपर्टी सेट करना - object.style.captionSide = "top|bottom|initial|inherit&quo