我有两张桌子:
<table width="200" id="table1" border=1 style="float:left;">
<tr><th>Subject</th><th>Hour</th></tr>
<tr class="head"><td colspan=2>MONDAY</td></tr>
<tr><td>English</td><td>3pm</td></tr>
<tr><td>Spanish</td><td>4pm</td></tr>
<tr class="head"><td colspan=2>TUESDAY</td></tr>
<tr><td>Italian</td><td>1pm</td></tr>
<tr><td>French</td><td>2pm</td></tr>
<tr class="head"><td colspan=2>WEDNESDAY</td></tr>
<tr><td>Japanese</td><td>10pm</td></tr>
</table>
<table width="200" id="table2" border=1 style="float:left;">
<tr><th>Users</th></tr>
<tr class="second"><td>User1</td></tr>
<tr class="second"><td>User2</td></tr>
<tr class="second"><td>User3</td></tr>
<tr class="second"><td>User4</td></tr>
<tr class="second"><td>User5</td></tr>
</table>
我想要实现的是,对于表 1 中的每个头类,我想插入空白表行,以便表 2 中的用户将匹配正确的主题(不是日期名称),因此它将User1
与English
, User1
->处于同一行Spanish
。 .. 等等。
注意:如果你问为什么这些表看起来像这样,那是因为它们是从另一个页面动态加载的,我只能使用 jquery/javascript 将一些 id 属性设置为 td、tr 或表等。准备粘贴到JSFiddle中的示例
编辑:我想在表二中插入空白行,这样它们看起来都一样。这是我想要实现的结果的链接LINK