javascript - 使用 jQuery 操作 HTML 表格

Question

我有一个看起来像这样的表:

我在硬编码的几页上有相同的图表。

我希望能够使用 js 和 jQuery 更改所有页面上的表格

我想让 YTD 按钮靠近 From Date 输入 MTD 位于 To Date 输入的旁边。

我在这里尝试这样做: http://jsfiddle.net/maniator/W9YFF/9/

但它似乎在某些地方变得困惑。

我该如何解决？

---

更新

如果我尝试做

$('input[type="button"][value="YTD"]').insertAfter($('#fdate'));
$('input[type="button"][value="MTD"]').insertAfter($('#tdate'));

我的结果是这样的:

Answer 1

我是不是误解了一些重要的东西，还是只是这样做了？

$('input[type="button"][value="YTD"]').insertAfter($('#fdate'));
$('input[type="button"][value="MTD"]').insertAfter($('#tdate'));

示例:http://jsfiddle.net/niklasvh/TghZ3/

编辑

如果您想改为编辑表结构，可以这样做:

$(".main tr:not(:first):not(:last)").append($('<td />'));
$(".main tr:first th, .main tr:last td").attr('colspan',3);


$(".main tr:lt(2) td:last").append($('.YTD'));
$(".main tr:lt(3) td:last").append($('.MTD'));

示例:http://jsfiddle.net/niklasvh/TghZ3/41/

编辑2

如果您只想向这 2 行添加新单元格，然后对其余行进行 colspan:

$(".main td:last-child:not(.first)").attr('colspan',function(i,a){
    if (typeof a == "undefined") a = 1;
    return (parseInt(a)+1);
});

$(".main tr:first th, .main tr:last td").attr('colspan',3);


$(".main tr:lt(2) td:last").attr('colspan','').after($('<td />').append($('.YTD')));

$(".main tr:lt(3) td:last").attr('colspan','').after($('<td />').append($('.MTD')));

示例:http://jsfiddle.net/niklasvh/TghZ3/57/