在页面上根据数据，动态创建表格

var arr = [
{
name: ‘Jack’,
age: 18,
gender: ‘男’
},{
name: ‘Rose’,
age: 20,
gender: ‘女’
},{
name: ‘Top’,
age: 22,
gender: ‘男’
}
]
创建一个表格，展示上面数组中的信息

<style>*{margin: 0;padding: 0;}table,td{border: 1px solid #000;border-spacing: 0;border-collapse:collapse;margin: 0 auto;}</style>
</head>
<body><script>var arr = [{name: 'Jack',age: 18,gender: '男'},{name: 'Rose',age: 20,gender: '女'},{name: 'Top',age: 22,gender: '男'}]function fn(){document.write("<table>");for(var i=0;i<arr.length;i++){document.write("<tr>");for(var key in arr[i]){document.write("<td>");document.write(arr[i][key]);document.write("</td>");}document.write("</tr>");}document.write("</table>");}fn();</script>

在页面上根据数据，动态创建表格相关推荐

html根据数据动态创建表格,HTML　DOM动态创建表格（１）
table, td, th { border:1px solid black; color: red; } var txt = '[\ {\ "id":1,\ "name ...
FineUIMvc随笔（1）动态创建表格列
声明:FineUIMvc(基础版)是免费软件,本系列文章适用于基础版. <FineUIMvc随笔>目录 FineUIMvc随笔(1)动态创建表格列 FineUIMvc随笔(2)怎样在控件中 ...
javascript动态创建表格：新增、删除行和列
利用js来动态创建表格有两种格式,appendChild()和insertRow.insertCell().两种方式其实差不多,但第一种有可能在IE上有问题,所以推荐大家使用第二种了,直接说吧. 1. ...
在iView中动态创建表格
最近在使用iView中的表格组件时,碰到许多坑和疑惑,仔细研究了一下table组件,发现官方文档讲的不是很清楚,本文将介绍并使用table组件,做一个动态创建表格的demo,效果如下图. 一.在col ...
javascript 动态创建表格：新增、删除行和单元格
2019独角兽企业重金招聘Python工程师标准>>> 利用js来动态创建表格有两种格式,appendChild()和insertRow.insertCell().两种方式其实差不多 ...
动态创建表格给同一个标签创建点击事件并让点击事件操作内容不一样
动态创建表格给同一个标签创建点击事件,每个点击事件操作的元素不一样. 现在有这样的需求,点击"查看详细"显示或隐藏标签.要实现这样的效果就要给点击标签添加两个属性,一个属性是nam ...
js动态创建表格以及赋值
1.使用js动态创建表格 (1)不可编辑的表格 function creatTableA() {var tbody = document.querySelector('#tableA');for (v ...
JavaScript学习（二十二）—动态创建表格
JavaScript学习(二十二)-动态创建表格效果如下: 代码如下: <!DOCTYPE html> <html lang="en"><head& ...
利用javascript动态创建表格
//说明:实现功能.原理上文相同.不过这次是利用已有的简单的方法创建行和列,并实现内容行鼠标移入变色功能! 效果图: /*两个方法 1. trNode table.insertRow(-1) ...

在页面上根据数据，动态创建表格

在页面上根据数据，动态创建表格

在页面上根据数据，动态创建表格相关推荐

最新文章

热门文章