<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
request.setAttribute("path", request.getContextPath());
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!doctype html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>转化</title>
<%@ include file="/common/new_header.jsp" %>
<style type="text/css">
#tableHtml{
width:50%;
margin: 20px;
}
#tableHtml th {
margin: 3px;
padding: 0.4em;
font-size: 1.2em;
height: 25px;
border:solid 1px;
text-align: center;
}
</style>
<script type="text/javascript">
var columnModel = [
{ display: '测试一', columns : [
{ display: "测试1" },
{ display: "测试2", columns: [
{},
{}
] }
]},
{ display: 'b', name: 'b', align: 'left'},
{ display: 'c', name: 'c', align: 'left'},
{ display: 'd', name: 'd', align: 'left'}
];
function modelToTableHtml(columnModel){
}
function tableHtmlToModel(tableHtml){
var columnModel=[];
})
// columnModel.push(colData);
console.log(columnModel);
}
function test_02(){
tableHtmlToModel($('#tableHtml')[0].outerHTML);
}
function test_01(){
modelToTableHtml(columnModel);
}
</script>
</head>
<body>
<table id="tableHtml">
<tr>
<th colspan="2" rowspan="1" >测试一</th>
<th colspan="2" rowspan="1" >测试二</th>
<th colspan="1" rowspan="2" >测试三</th>
</tr>
<tr>
<th colspan="1" rowspan="1" >测试1</th>
<th colspan="1" rowspan="1" >测试2</th>
<th colspan="1" rowspan="1" >测试1</th>
<th colspan="1" rowspan="1" >测试2</th>
</tr>
</table>
<br/>
<button type="button" onclick="test_02();" style="padding: 8px;margin-left: 20px">tableHtmlToModel</button>
<button type="button" onclick="test_01();" style="padding: 8px;margin-left: 20px">modelToTableHtml</button>
</body>
</html>
转化后格式::
val columnModel = [
{ display: '测试一', columns : [
{ display: "测试1" },
{ display: "测试2" }
]},
{ display: '测试二', columns : [
{ display: "测试1" },
{ display: "测试2" }
]}
{ display: '测试三'}
],