本文介绍了一种使用JavaScript操作HTML表格的方法，包括反转表格内容并保留原始的行和列跨度属性。通过对表格元素进行处理，可以实现表格内容的反转，并且通过临时保存和恢复行跨度(rowspan)及列跨度(colspan)属性确保了表格结构的正确性。
revertTable: function (obj) {
$("tr", obj).each(function (trindex, tritem) {
$($(tritem).find("th").toArray().reverse()).each(function (tdindex, tditem) {
var rowspanCount = !!$(tditem).attr("rowspan")?parseInt($(tditem).attr("rowspan")):1;
var colspanCount = !!$(tditem).attr("colspan")?parseInt($(tditem).attr("colspan")):1;
var value = $(tditem).text();
var newtd = "<th data-flag='F'>" + value + "</th>";
if (rowspanCount > 1) {
var parent = $(tditem).attr("data-rowspan",rowspanCount).parent("tr")[0];
while (rowspanCount-- > 1) {
$(parent).next().prepend(newtd);
parent = $(parent).next();
}
$(tditem).removeAttr("rowspan", 1);
}
if (colspanCount > 1) {
$(tditem).attr("data-colspan",colspanCount);
while (colspanCount-- > 1) {
$(tditem).after(newtd);
}
$(tditem).removeAttr("colspan");
}
});
});
},
redoTable:function(obj){
$("th[data-flag]",obj).remove();
$("th[data-colspan]",obj).each(function(i,v){
$(this).attr("colspan",$(this).attr("data-colspan")).removeAttr("data-colspan");
});
$("th[data-rowspan]",obj).each(function(i,v){
$(this).attr("rowspan",$(this).attr("data-rowspan")).removeAttr("data-rowspan");
});
},
扫一扫
843
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
