服务器响应的资源渲染在浏览器

news/2024/10/31 1:28:28/

服务器响应的数据是以数组形式的例如:

arr=[{id:1,name:'iPhone4',price:1999},{id:2,name:'iPhone5',price:2999},{id:3,name:'iPhone6',price:3999},{id:4,name:'iPhone7',price:4999},{id:5,name:'iPhone7s',price:5999}];

 如果想要把数据响应到浏览器页面表格中,则需要使用循环遍历数组,然后添加到表格中

代码如下:

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><!-- 综合展示表格的动态数据 --><table border="2px" cellpadding="1px" cellspacing="0" width="400px"><thead><tr><th>编号</th><th>商品名</th><th>商品价格</th></tr></thead><tbody id="tab"></tbody></table><script type="text/javascript">//提交服务器数据var arr = [{id:1,name:'iPhone4',price:1999},{id:2,name:'iPhone5',price:2999},{id:3,name:'iPhone6',price:3999},{id:4,name:'iPhone7',price:4999},{id:5,name:'iPhone7s',price:5999}];//1.创建字符串var str=''//2.创建循环遍历每个数据for(let i=0;i<arr.length;i++){//2.1创建变量,拼接字符串str+=`<tr><td>${arr[i].id}</td><td>${arr[i].name}</td><td>${arr[i].price}</td></tr>`}tab.innerHTML=str</script></body>
</html>

http://www.ppmy.cn/news/307855.html

相关文章

苹果有arkit,android,ARKit来袭:苹果ar支持哪些设备,苹果手机怎么使用ar?

在6月份的WWDC2017大会上&#xff0c;ARKit的横空出世让大家看到苹果对增强现实的决心。和其他AR设备有所不同&#xff0c;苹果ARKit需要的只是iPhone或iPad&#xff0c;因此“让iOS变成最大的AR平台”完全有可能实现。不过&#xff0c;并非所有iOS设备都可以使用ARKit&#xf…

记录一下iphone7s维修过程

原本以为像盐城这样的三线城市没有苹果维修点呢&#xff08;我说的是经过苹果官方授权的维修点&#xff0c;不是路边上杂牌的手机维修点&#xff09;。没想到在苹果维修点查询还真有&#xff0c;虽然不是直营店&#xff0c;但是已经欣喜若狂了。 挑选了离家最近的盐城苹果维修…

大数据手段分析苹果手机营销-以iphone8为例

苹果Iphone三个月来在百度搜索中的搜索轨迹 Iphone8的搜索热度很明显在2017年8月前虽占有一定数量&#xff0c;但自8月份以来&#xff0c;Iphone8的搜索量相较于前两个月呈现井喷式增长&#xff0c;连续创造了两个峰值。这一切都要归功于苹果官方&#xff08;9月1日&#xff09…

sass、less、stylus的区别

基本的写法区别 less&#xff1a; 标准的css语法 &#xff0c;有花括号和冒号 h1 {color: #0982C1; }sass&#xff1a; 当然也可以写成上面那样 同时也可以不写花括号 h1color: #0982c1stylus&#xff1a; 花括号和冒号都可以不写 比较自由 h1color #0982C1变量上的差异 Les…

3.1_7 JavaSE入门 P6 【面向对象】概述封装

相关链接 Excel目录 目录 Part6 【面向对象】概述&封装1 面向对象概述1.1 面向对象思想1.1.1 面向过程思想与面向对象思想1.1.2 面向过程特点与面向对象特点 1.2 类与对象概述 2 对象的内存图2.1 一个对象的内存图2.2 两个对象的内存图(共用方法区)2.3 两个对象的内存图(两…

转载:iPhone8重新设计发布延期,iPhone8或推迟上市时间

从事ios开发两年多&#xff0c;本人也算是苹果的伪粉吧&#xff0c;从去年都关注iPhone8的动态&#xff0c;到了今年就听说最新的苹果手机估计赶不上今年苹果十周年发布了&#xff0c;原因可能是苹果公司遇到一个技术问题&#xff0c;影响了iPhone8的如期推出。 今年是iPhone的…

7stars

<html><head><style><!--body, p, div,td,input {font:menu;line-height: 150%}.div { font-family: 宋体; font-size: 12px; line-height: 150% }--></style><title>7Stars</title></head><body><script language&q…

Java seven

今天学习了while循环和do while循环 进行了相应循环的简单练习 并从中掌握了一些重要的知识点 进行嵌套循环的学习 并合理的完成了菱形的代码编写 所接触的java与C语言有较大的的类似之处 public class Main { public static void main(String[] args) {for (int i 0;i < …