这篇文章主要介绍jquery如何通过ajax请求获取后台数据显示在表格上，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
十载的阳泉网站建设经验，针对设计、前端、开发、售后、文案、推广等六对一服务，响应快，48小时及时工作处理。营销型网站建设的优势是能够根据用户设备显示端的尺寸不同，自动调整阳泉建站的显示方式，使网站能够适用不同显示终端，在浏览器中调整网站的宽度，无论在任何一种浏览器上浏览网站，都能展现优雅布局与设计，从而大程度地提升浏览体验。创新互联建站从事“阳泉网站设计”,“阳泉网站推广”以来，每个客户项目都认真落实执行。
1、引入bootstrap和jquery的cdn
2、html部分
名字
开始时间
是否真实
设备
3、js部分
1>使用for in
$(function(){
$.ajax({
url:'data.json',
type:'get',
dataType:'json',
success:function(data){
//方法中传入的参数data为后台获取的数据
for(i in data.data) //data.data指的是数组，数组里是8个对象，i为数组的索引
{
var tr;
tr=''+data.data[i].name+''+''+data.data[i].startTime+''+''+data.data[i].is_true+''+''+data.data[i].device+''
$("#tabletest").append(''+tr+'')
}
}
})
}) ***注意**** for in 通常用于对象
遍历数组的两种方法(each,foreach)：
$.each(arr,function(index,item){})
arr.forEach(function(item,index))
// arr为数组 ,index索引，item为当前值2>each方法
$(function(){
$.ajax({
url:'data.json',
type:'get',
dataType:'json',
success:function(data){
$.each(data.data,function(index,item){
var tr;
tr=''+item.name+''+''+item.startTime+''+''+item.is_true+''+''+item.device+'';
$("#tabletest").append(''+tr+'')
})
}
})})总结：获取对象属性的方法：item.name或item['name']
jquery添加节点方法：
ul.append('
'+哈哈+'')
append:在之前添加li
prepend:在
之后添加libefore:在
之后添加li-----延伸----
（1）将数据中is_true中的0转换为中文
采用三目运算或条件判断
item.is_true=parseInt(item.is_true)==0?'否':'是'
//注意数据是string类型需转换，且三目运算符返回的是结果不能写成item.is_true==0? item.is_true='否': item.is_true='是'
（2）将数据中device过滤只显示冒号以前的数据
item.is_true=parseInt(item.is_true)==0?'否':'是'
var arr=item.device.split(":")
item.device=arr[0]split()分隔符方法用于把一个字符串分割成字符串数组
4.data.json文件
{
"status": 0,
"data": [
{
"name": "天王盖地虎",
"startTime": "2017-03-02 00:00",
"is_true":"0",
"device": "SM-C9000:samsung"
},
{
"name": "宝塔镇河妖",
"startTime": "2017-03-02 00:00" ,
"is_true":"0",
"device": "SM705:smartisan"
},
{
"name": "锄禾日当午",
"startTime": "2017-03-02 00:00" ,
"is_true":"0" ,
"device": "EVA-AL00:HUAWEI"
}
]
}效果图：
jquery是什么
jquery是一个简洁而快速的JavaScript库，它具有独特的链式语法和短小清晰的多功能接口、高效灵活的css选择器，并且可对CSS选择器进行扩展、拥有便捷的插件扩展机制和丰富的插件，是继Prototype之后又一个优秀的JavaScript代码库，能够用于简化事件处理、HTML文档遍历、Ajax交互和动画，以便快速开发网站。
以上是“jquery如何通过ajax请求获取后台数据显示在表格上”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注创新互联行业资讯频道！
当前名称：jquery如何通过ajax请求获取后台数据显示在表格上
文章分享：
http://mbwzsj.com/article/ihphgp.html
