JS动态生成Table
var _data = [
{'name': 'a','id': 'b1','sex': 'b', 'age': '1'},
{'name': 'a','id': 'b2','sex': 'g','age': '2'},
{'name': 'a','id': 'b3','sex': 'g','age': '3'},
{'name': 'a','id': 'b4','sex': 'b','age': '4' }
]
var UI = {};
UIGrid = {};
function creatTable(current,o){
var table = documentcreateElement('table');
tableid = oid;
tablestylecssText = 'width: 300px; height: 100px;border-collapse:collapse;border: 1px solid #DDDDDD;';
var thead = documentcreateElement('thead');
var th = documentcreateElement('tr');
thstylewidth = '300px';
thstylecssText = 'background: #ffffff';
var tbody = documentcreateElement('tbody');
tbodystylecssText = 'border: 1px solid #DDDDDD;';
for(var i = 0 ; i < ocloumlength ; i++){
var td = documentcreateElement('td');
tdstylewidth = '75px' ;
var span = documentcreateElement('span');
spaninnerHTML = ocloum[i]head;
spanstylelineHeight = '30px';
//spanstylefontFamily = '宋体';
spanstylefontSize = '25px';
tdappendChild(span);
tdstyletextAlign = 'center';
thappendChild(td);
}
theadappendChild(th);
for( var j = 0 ; j < odatalength ; j++){
var tr = documentcreateElement('tr');
//var att = getKeys(trattributes);
// consoleinfo(att);
// consoleinfo(trattributes);
// consoleinfo(trattributeslength);
// trattributesselected = false;
for(var i = 0 ; i < ocloumlength ; i++){
var td = documentcreateElement('td');
var text = odata[j][ocloum[i]datafield] ; //应该有个加载function调用
tdinnerHTML = text;
tdstyletextAlign = 'center';
tdstylecssText = 'border-left: 1px solid #DDDDDD;border-right: 1px solid #DDDDDD;text-align:center';
trappendChild(td);
}
trstylecssText = 'border-top: 1px solid #DDDDDD;';
tbodyappendChild(tr);
}
tableappendChild(thead);
tableappendChild(tbody);
currentappendChild(table);
};
$fncreatSth = function(o){
UIGrid[oid] = o ;
var current = this[0];
var table = documentcreateElement('table');
tablestylecssText = 'border-collapse:collapse;border: 1px solid #DDDDDD;';
//line 1
var tr1 = documentcreateElement('tr');
tr1styleheight = '8px';
var td11 = documentcreateElement('td');
td11stylewidth = '8px';
var td12 = documentcreateElement('td');
var td13 = documentcreateElement('td');
td13stylewidth = '8px';
tr1appendChild(td11);
tr1appendChild(td12);
tr1appendChild(td13);
// toolbar - line
var trbar = documentcreateElement('tr');
trbarstyleheight = '15px';
var tdbar1 = documentcreateElement('td');
var tdbar2 = documentcreateElement('td');
var tdbar3 = documentcreateElement('td');
tdbar2innerHTML = '123123';
trbarappendChild(tdbar1);
trbarappendChild(tdbar2);
trbarappendChild(tdbar3);
//line 2
var tr2 = documentcreateElement('tr');
var td21 = documentcreateElement('td');
td21stylewidth = '8px';
var td22 = documentcreateElement('td');
creatTable(td22,o);
var td23 = documentcreateElement('td');
td23stylewidth = '8px';
tr2appendChild(td21);
tr2appendChild(td22);
tr2appendChild(td23);
//line 3
var tr3 = documentcreateElement('tr');
tr3styleheight = '8px';
var td31 = documentcreateElement('td');
td31stylewidth = '8px';
var td32 = documentcreateElement('td');
var td33 = documentcreateElement('td');
td33stylewidth = '8px';
tr3appendChild(td31);
tr3appendChild(td32);
tr3appendChild(td33);
tableappendChild(tr1);
if(otbar){
tableappendChild(trbar);
}
tableappendChild(tr2);
tableappendChild(tr3);
currentappendChild(table);
};
$('#test')creatSth({
id:'tb1',
cloum:[
{head:'name',datafield:'name'},
{head:'id',datafield:'id'},
{head:'sex',datafield:'sex'},
{head:'age',datafield:'age'}
],
data:_data
});
//获取jsonObject的key值
function getKeys(o){
var keys = [];
for(key in o){
keyspush(key);
}
return keys;
}
这个是用JS和jquery写的简单的JS表格,自己试试看吧
1、按照描述,题主是想将多条数据记录提交到服务端,同时服务端将数据插入到数据库。那么思路是将多条数据存在数组中,调用post方法的接口传入后端。
2、方法如下:
var sendData = [];
sendDatapush({name:'david',age:'20'});
sendDatapush({name:'peter',age:'23'});
3、传递数据给服务端,一般使用post方法调用接口,使用jquery,代码如下:
$post("接口路径",sendData,function(result){
consolelog(result,'发送结果');
});
扩展资料:
1、json与字符串互相转换:
JSONparse('{"name":"karla"}')//将字符串转换为json
JSONstringify({name:'karla'})//将json转化为字符串
2、jquery中post与get的区别:
1) $get() 方法使用GET方法来进行异步请求的。$post() 方法使用POST方法来 进行异步请求的。
2)get请求会将参数跟在URL后进行传递,而POST请求则是作为HTTP消息的实体 内容发送给Web服务器的,这种传递是对用户不可见的。
3) get方式传输的数据大小不能超过2KB 而POST要大的多。
4)GET 方式请求的数据会被浏览器缓存起来,因此有安全问题。
参考资料:
分类: 电脑/网络 >> 互联网
问题描述:
学用DW8做网页,听人说要将数据动态生成到一个js文件,怎么做,能举例说一下吗?
解析:
script 引用的脚本不一定是 js 文件
你可以做这样的实验
新建一个页面写上
<script src=aa></script>
aa 的内容是
<%
responsewrite "alert('花衣燕子')"
%>
试试看
JS动态生成Table
本文2023-10-26 16:58:15发表“资讯”栏目。
本文链接:https://www.lezaizhuan.com/article/346230.html