栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

将TD列转换为TR行

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

将TD列转换为TR行

您想要将HTML排列成这样:

<tr><td>A</td><td>B</td><td>C</td><td>D</td></tr><tr><td>1</td><td>2</td><td>3</td><td>4</td></tr>

变成这个:

<tr><td>A</td><td>1</td></tr><tr><td>B</td><td>2</td></tr><tr><td>C</td><td>3</td></tr><tr><td>D</td><td>4</td></tr>

正确?

您可以使用Javascript来做到这一点,但是,很难在不完全了解站点/ HTML文件的结构的情况下建议一种方法。我会去的。

假设您的

<table>
代码带有ID(例如:
<table id="myTable">
您可以像这样在javascript中访问它:

var myTable = document.getElementById('myTable');

您可以创建一个新表,如下所示:

var newTable = document.createElement('table');

现在,您需要将旧表行转置为新表列:

var maxColumns = 0;// Find the max number of columnsfor(var r = 0; r < myTable.rows.length; r++) {    if(myTable.rows[r].cells.length > maxColumns) {        maxColumns = myTable.rows[r].cells.length;    }}for(var c = 0; c < maxColumns; c++) {    newTable.insertRow(c);    for(var r = 0; r < myTable.rows.length; r++) {        if(myTable.rows[r].length <= c) { newTable.rows[c].insertCell(r); newTable.rows[c].cells[r] = '-';        }        else { newTable.rows[c].insertCell(r); newTable.rows[c].cells[r] = myTable.rows[r].cells[c].innerHTML;        }    }}

这应该做您需要的。被预先警告:未经测试。留给读者练习这些javascript代码到HTML页面中的练习。如果有人发现我错过的任何错误,如果您向我指出这些错误,或者只是进行编辑以解决问题,我将不胜感激:)



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/465088.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号