最近の更新

2012年9月5日水曜日

テーブルのカラムの属性をまとめて変更する方法(HTMLのcolタグ)

【目的】
JavaScriptで、HTMLのテーブルのカラムの属性をまとめてHTMLのcolタグで変更します。



【手順】
1.「017-TableColJS.html」というファイルを作成。
2.「017-TableColJS.html」を以下の様に入力。
<html>
<head>
</head>
<body>
    <table border="1">
        <col span="2" id="col1" width="200" align="center"/>
        <tr>
            <td>セル1-1</td>
            <td>セル1-2</td>
        </tr>
        <tr>
            <td>セル2-1</td>
            <td>セル2-2</td>
        </tr>
    </table>
    <input type="button" value="left" onclick="javascript:col1.align='left';">
    <input type="button" value="center" onclick="javascript:col1.align='center';">
    <input type="button" value="right" onclick="javascript:col1.align='right';">
</body>
</html>

3.「017-TableColJS.html」をブラウザで開きます。
4.以下の様に表示されれば成功です。







































以上です。

0 件のコメント:

コメントを投稿

注: コメントを投稿できるのは、このブログのメンバーだけです。

関連記事