JavaScript Reference/Javascript Properties/colSpan

Материал из Web эксперт
Перейти к: навигация, поиск

"colSpan" Example

<!-- 
Example revised from 
The Web Programmer"s Desk Reference
by Lazaro Issi Cohen and Joseph Issi Cohen 
ISBN: 1593270119
Publisher: No Starch Press 2004
-->    
<html>
<body>
<script language="JavaScript">
    function function1() {
        document.all.myTableHeader.colSpan = "3";
    }
    function function2() {
        document.all.myTd1.colSpan = "3";
    }
    function function3() {
        document.all.myTd2.colSpan = "2";
    }
    function function4() {
        document.all.myTableHeader.colSpan = "1";
        document.all.myTd1.colSpan = "1";
        document.all.myTd2.colSpan = "1"; 
    } 
</script>
<table>
    <tr>
        <th align="center" bgcolor="blue" style="color:white;">First Header</th>
        <th id="myTableHeader" bgcolor="green" style="color:white;"width="140">Second Header</th>
        <th align="center" bgcolor="red" style="color:white;" width="140">Third Header</th>
        <th align="center" bgcolor="gray" style="color:white;"width="140">Fourth Header</th>
    </tr>
    <tr>
        <td id="myTd1">Cell 1 content</td>
        <td>Cell 2 content</td>
        <td id="myTd2">Cell 3 content</td>
        <td>Cell 4 content</td>
    </tr>
</table>
<input type="button" name="S1" value="Span Second Header" onClick="function1();">
<input type="button" name="S2" value="Span Cell 1" onClick="function2();">
<input type="button" name="S3" value="Span Cell 3" onClick="function3();">
<input type="button" name="S4" value="Restore" onClick="function4();">
</body>
</html>



"colSpan" is applied to

+----------------+--------------------------------------------------------------+
| Applied_To     |<td>                            <th>                          |
+----------------+--------------------------------------------------------------+



"colSpan" Syntax and Note

Note:
Read and write property. 
Set the number of columns in a table that <td> or <th> element will span.
    
Syntax:
    
document.getElementById("elementID").colSpan = value
document.all.elementID.colSpan = value // IE only
Источник — «http://wbex.ru/index.php?title=JavaScript_Reference/Javascript_Properties/colSpan&oldid=7507»