<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>动态生成表格</title>
</head>
<body>
行:<input type="text" id="row">
列:<input type="text" id="col">
<br />
<input type="button" value="生成" onclick="createTable()" />
<br />
<div id="container"></div>
</body>
<script type="text/javascript">
function createTable() {
// 获取行和列
var row = document.getElementById("row").value;
var col = document.getElementById("col").value;
// 获取放置表格的容器
var container = document.getElementById("container");
// 生成表格
var tab = "<table border='1' width='100%'>";
for (var i = 1; i <= row; i++) {
tab += "<tr align='center'>";
for (var j = 1; j <= col; j++) {
tab += "<td>" + j + "</td>";
}
tab += "</tr>";
}
tab += "</table>";
container.innerHTML = tab;
}
</script>
</html>

JavaScript基础7——动态生成表格的更多相关文章

  1. JavaScript中动态生成表格

    动态生成表格,首先需要输入并获取动态的数字,html中结构代码如下:行:<input type="text" id="row" value="5 ...

  2. js动态生成表格

    动态生成表格           *创建一个页面:两个输入框和一个按钮 *代码和步骤                      /*                          1.得到输入的行 ...

  3. 编辑表格输入内容、根据input输入框输入数字动态生成表格行数、编辑表格内容提交传给后台数据处理

    编辑表格输入内容.根据input输入框输入数字动态生成表格行数.编辑表格内容提交传给后台数据处理 记录自己学习做的东西,写的小demo,希望对大家也有帮助! 代码如下: <!DOCTYPE ht ...

  4. 【转】ASP.NET中服务器控件Table动态生成表格及其属性介绍

    下文所有内容转自开源中国:http://www.oschina.net/question/565065_86453#tags_nav ================================= ...

  5. (转载)PHP 动态生成表格

    (转载)http://hi.baidu.com/shawns/item/c7d51f351c6a0482b711dba6 提要:PHP能够高效地生成HTML代码,其中,动态生成表格是实际应用中经常碰到 ...

  6. JS动态生成表格后 合并单元格

    JS动态生成表格后 合并单元格 最近做项目碰到表格中的单元格合并的问题,需求是这样的,首先发ajax请求 请求回来后的数据 动态生成表格数据,但是生成后如果编号或者(根据其他的内容)有相同时,要合并单 ...

  7. 动态生成表格呈现还是将表格直接绑定gridview等控件呈现的开发方式选择依据

    动态生成表格呈现还是将表格直接绑定gridview等控件呈现的开发方式选择依据:由存储过程决定,如果编写的存储过程可以生成需要呈现的表格则直接绑定,否则要动态生成表格

  8. vue+element创建动态的form表单.以及动态生成表格的行和列

    动态创建form表单,网上有插件 (form-create) 不过我不知道它怎么用,没有使用成功,如果你使用成功了,欢迎下方留言. 最后我使用了笨方法,针对各个表单写好通用的组件,然后根据type用v ...

  9. javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行

    jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...

随机推荐

  1. linux运维、架构之路-Kubernetes集群部署

    一.kubernetes介绍        Kubernetes简称K8s,它是一个全新的基于容器技术的分布式架构领先方案.Kubernetes(k8s)是Google开源的容器集群管理系统(谷歌内部 ...

  2. 面试题常考&必考之--js闭包特性和优缺点 (外加小例子)

    当内部函数被返回到外部并保存时,一定会产生闭包.闭包会产生原来的作用域链,不释放. 闭包,可以理解为,写一个函数,然后产生闭包的这种现象. 概念: 基础: 主要是:add    reduce  被返回 ...

  3. AC自动机及其模板

    模板 #include<queue> #include<stdio.h> #include<string.h> using namespace std; ; ; ; ...

  4. Oulipo【Hash】

    Oulipo Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 45515   Accepted: 18181 Descript ...

  5. mui初级入门教程(七)— 基于native.js的文件系统管理功能实现

    文章来源:小青年原创发布时间:2016-08-01关键词:mui,nativejs,android转载需标注本文原始地址: http://zhaomenghuan.github.io... 前言 这段 ...

  6. 分类汇总统计mysql数据库一个字段中不同的记录的总和

    方法1.用 if 语句,如下例. 方法2.用case when then else 语句,用法如同if. mysql> select sum(if(id<500,1,0)),sum(if( ...

  7. Microsoft Visual Studio 2013 Language Pack

    Microsoft Visual Studio 2013 Language Pack Microsoft Visual Studio 2013 各版本语言包下载地址: https://my.visua ...

  8. 7月清北学(zao)堂系列

    7.13:模拟,贪心(贪心题大赏),考试 7.14:分治,分块,搜索(大法师大法好),数论 7.15:数据结构(树状数组,线段树,),ST表,树上倍增求LCA 7.16:图论题大赏(分层建图神马的), ...

  9. P3928奶酪

    传送 今天早晨,神志不清的我决定拿头过这道题 终于在wa了6次之后过了 emm  明明都是一些细节自己却注意不到啊啊啊不能再颓了!!!!!!!!!!!! 好了回归正题 首先我们要开long long ...

  10. 圆角Panel

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Diagnostic ...