<!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. 前端node面试题之---对比JS和NodeJS的区别

    区别: 1.JS运行在浏览器端,用于用户的交互效果,NodeJS运行在服务器端,用于服务器的操作,例如,Web服务器创建,数据库的操作,文件的操作等 2.JS运行在浏览器端,存在多个JS解释器,存在兼 ...

  2. Vue中v-for配合使用Swiper插件问题

    问题描述: 在一个页面中需要一个用swiper的轮播图,数据大概有40条,每一屏幕的swiper只显示其中的n条数据. 代码描述: <div id="app"> < ...

  3. XXX is not a function

    今天,一个以前的小伙伴跟我说他遇到了一个问题,调试了将近两天(这家伙一开始不打算干程序员,跑去干了两个月销售,现在又想回来写代码了,所以就自己折腾一个demo,免得面试的时候被问住) 我把他的代码从头 ...

  4. jsoncpp 能做什么

    jsoncpp能做什么1)跨平台跨语言动态信息数据交换.2)作为格式化配置文件使用3)对应数据结构数据类型做序列化和反序列化4)value::toStyledString 格式化json串输出 一.w ...

  5. [BZOJ4817][SDOI2017]树点涂色:Link-Cut Tree+线段树

    分析 与[BZOJ3779]重组病毒唯一的区别是多了一个链上求实链段数的操作. 因为每条实链的颜色必然不相同且一条实链上不会有两个深度相同的点(好像算法的正确性和第二个条件没什么关系,算了算了),画图 ...

  6. [CSP-S模拟测试]:f(Trie树+二分答案+meet in middle+two pointers)

    题目传送门(内部题67) 输入格式 第一行,三个整数$n$.$k$.$p$.第二行,$n$个自然数,表示$\{a_i\}$. 输出格式 输出一行,两个自然数,表示$f(res)$.$res$. 样例 ...

  7. 《SQL Server 2012 T-SQL基础》读书笔记 - 10.可编程对象

    Chapter 10 Programmable Objects 声明和赋值一个变量: DECLARE @i AS INT; SET @i = 10; 变量可以让你暂时存一个值进去,然后之后再用,作用域 ...

  8. 自定义控件 - 切换开关:SwitchView

    自定义控件一般的几个步骤:1.初始化相关背景图片,布局文件,自定义属性2.设置控件宽高OnMeasure()3.布局或者排版OnLayout()4.绘制控件OnDraw()5.处理触摸事件OnTouc ...

  9. accomplish、complete、finish、achieve和fulfill

    accomplish to succeed in doing something, especially after trying very hard vt. 完成:实现:达到 complete us ...

  10. scrapy-splash常用设置

    # Splash服务器地址 SPLASH_URL = 'http://localhost:8050' # 开启Splash的两个下载中间件并调整HttpCompressionMiddleware的次序 ...