Js--动态生成表格
<div>
<h1>动态生成表格</h1>
<div id="table1">
行:<input type="text" id="h"/>
列:<input type="text" id="l"/>
<input type="button" value="生成" onclick="addTable();" />
<div id="divt"></div>
</div>
</div>
<script type="text/javascript">
function addTable(){
/*动态生成表格
1、得到输入的行和列的值
2、生成表格
循环行
在行里面循环单元格
3、显示到页面上
把表哥的代码设置到div里面
使用innerHTML属性
*/
var h=document.getElementById("h").value;
var l=document.getElementById("l").value;
var divtab=document.getElementById("divt");
//把表格代码放到一个变量里面
var tab="<table border='solid'>";
for(var i=0;i<h;i++){
tab+="<tr>";
for(var j=0;j<l;j++){
tab+="<td>";
tab+="aaaaa";
tab+="</td>";
}
tab +="</tr>";
}
tab+="</table>";
divtab.innerHTML=tab;
}
</script>
Js--动态生成表格的更多相关文章
- JS动态生成表格后 合并单元格
JS动态生成表格后 合并单元格 最近做项目碰到表格中的单元格合并的问题,需求是这样的,首先发ajax请求 请求回来后的数据 动态生成表格数据,但是生成后如果编号或者(根据其他的内容)有相同时,要合并单 ...
- js动态生成表格
动态生成表格 *创建一个页面:两个输入框和一个按钮 *代码和步骤 /* 1.得到输入的行 ...
- js 动态生成表格案例
<1>布局:一个table表格,表格分为两个部分,上面是thead表头,表头里面仅一行,有4列(th), 下面是tbody表格内容,要求tbody中的每一行都是用js动态创建的 < ...
- 利用JS动态生成隔行换色HTML表格
用JS生成动态生成表格,行.列由用户输入,并使表格隔行换色 方法一. 代码: <!DOCTYPE html> 2 <html> 3 <head> 4 <tit ...
- js动态生成数据列表
我们通常会使用table标签来展示数据内容,由于需要展示的数据内容是随时更换的,所以不可能将展示的数据列表写死在html写死在页面中,而是需要我们根据后台传来的数据随时更换,这个时候就需要我们使用js ...
- js动态添加-表格逐行添加、删除、遍历取值
关于js对表格进行逐行添加,今天抽空整理了一下:新建一个html文件(没有编辑器的可以新建一个demo.txt文件,然后改后缀名为demo.html),把下面代码全部贴进去即可.功能包括:表格添加一行 ...
- 编辑表格输入内容、根据input输入框输入数字动态生成表格行数、编辑表格内容提交传给后台数据处理
编辑表格输入内容.根据input输入框输入数字动态生成表格行数.编辑表格内容提交传给后台数据处理 记录自己学习做的东西,写的小demo,希望对大家也有帮助! 代码如下: <!DOCTYPE ht ...
- JavaScript中动态生成表格
动态生成表格,首先需要输入并获取动态的数字,html中结构代码如下:行:<input type="text" id="row" value="5 ...
- JS动态生成的元素,其对应的方法不响应(比如单击事件,鼠标移动事件等)
主要原因:在页面给元素注册点击事件的时候[ $(function () { XXX }); ],JS动态生成的元素还尚未生成,所以click事件就没有生效 解决方法: 方案一:js动态生成元素后再给 ...
- 抓取Js动态生成数据且以滚动页面方式分页的网页
代码也可以从我的开源项目HtmlExtractor中获取. 当我们在进行数据抓取的时候,如果目标网站是以Js的方式动态生成数据且以滚动页面的方式进行分页,那么我们该如何抓取呢? 如类似今日头条这样的网 ...
随机推荐
- day26 Python isinstance和issubclass
isinstance(obj,cls)检查是否obj是否是类 cls 的对象 issubclass(sub, super)检查sub类是否是 super 类的派生类 class Foo(object) ...
- ORA-27154: post/wait create failed ORA-27300 ORA-27301 ORA-27302
今天刚装了Oracle 11g,配制好了之后启动数据库时遇到下面的错误:SQL> startupORA-27154: post/wait create failedORA-27300: OS s ...
- ORA-00600: internal error code, arguments: [2662]
转自 http://www.eygle.com/archives/2005/12/oracle_diagnostics_howto_deal_2662_error.html 在ORA-00600 22 ...
- Emacs 中使用 shell
直接在 Emacs 中使用 shell 能增加一点效率.Emacs 本身支持的 shell 相关的命令很多,此处化繁为简,只用一条足够了. M-x shell:将打开一个名为 * shell * 的 ...
- python libnum库安装使用方法
libnum库是一个关于各种数学运算的函数库,它包含common maths.modular.modular squre roots.primes.factorization.ECC.converti ...
- Scala--模式匹配和样例类
模式匹配应用场景:switch语句,类型查询,析构,样例类 一.更好的switch val ch :Char = '+' val sign = ch match{ case '+' => 1 c ...
- 使用C#创建SQLite控制台应用程序
本文属于原创,转载请注明出处,谢谢! 一.开发环境 操作系统:Windows 10 X64 开发环境:VS2015 编程语言:C# .NET版本:.NET Framework 4.0 目标平台:X86 ...
- MySQL表结构变更,不可不知的Metadata Lock
在线上进行DDL操作时,相对于其可能带来的系统负载,其实,我们最担心的还是MDL其可能导致的阻塞问题. 一旦DDL操作因获取不到MDL被阻塞,后续其它针对该表的其它操作都会被阻塞.典型如下,如阻塞稍久 ...
- 朱晔的互联网架构实践心得S2E1:业务代码究竟难不难写?
注意,这是我的架构实践心得的第二季的系列文章,第一季有10篇你也可以回顾. 见https://www.cnblogs.com/lovecindywang/category/1296779.html 最 ...
- java 接口实现防盗门功能
Door: package locker; public abstract class Door { public abstract void open(); public abstract void ...