JavaScript案例七：简单生成表格
JavaScript简单生成表格，巩固基础知识点。。。
<!DOCTYPE html>
<html>
<head>
<title>JavaScript简单生成表格</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" >
function create()
{
var h=document.getElementById("t1").value;
var l=document.getElementById("t2").value;
var table="<table border='1' bordercolor='red'>";
for(var i=0;i<h;i++)
{
table+="<tr>";
for(var j=0;j<l;j++)
table+="<td>詹姆斯</td>";
table+="</tr>";
}
table+="</table>"
document.getElementById("div1").innerHTML=table;
}
</script>
</head>
<body>
行：<input type="text" id="t1"/>
列：<input type="text" id="t2"/><br><br>
<input type="button" value="生成" onclick="create();">
<div id="div1"></div>
</body>
</html>
运行示意：
aaarticlea/png;base64,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" alt="" />
JavaScript案例七：简单生成表格的更多相关文章
- JavaScript基础7——动态生成表格
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Js--动态生成表格
<div> <h1>动态生成表格</h1> <div id="table1"> 行 ...
- javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行
jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...
- JavaScript中动态生成表格
动态生成表格,首先需要输入并获取动态的数字,html中结构代码如下:行:<input type="text" id="row" value="5 ...
- Javascript实现前端简单路由
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http ...
- js动态生成表格
动态生成表格 *创建一个页面:两个输入框和一个按钮 *代码和步骤 /* 1.得到输入的行 ...
- 在Linux下如何使用GCC编译程序、简单生成 静态库及动态库
最近在编写的一个Apache kafka 的C/C++客户端,,在看他写的 example中,他的编译是用librdkafka++.a和librdkafka.a 静态库编译的,,,而我们这 ...
- [转]javascript 快速隐藏/显示万行表格列的方法
原文地址:javascript 快速隐藏/显示万行表格列的方法 隐藏表格列,最常见的是如下方式: td.style.display = "none"; 这种方式的效率极低.例如,隐 ...
- （转载）PHP 动态生成表格
(转载)http://hi.baidu.com/shawns/item/c7d51f351c6a0482b711dba6 提要:PHP能够高效地生成HTML代码,其中,动态生成表格是实际应用中经常碰到 ...
随机推荐
- ASP.Net 5 上传文件通过虚拟路径存储
先贴上代码 [HttpPost] public IActionResult ImportTeaching(IFormFile file) { string root = @"Temp/tea ...
- Entity Framework 系统约定配置
前言 Code First之所以能够让开发人员以一种更加高效.灵活的方式进行数据操作有一个重要的原因在于它的约定配置.现在软件开发越来越复杂,大家都试图将软件设计的越来越灵活,很多内容我们都希望是可配 ...
- codeforces 258div2 B Sort the Array
题目链接:http://codeforces.com/contest/451/problem/B 解题报告:给出一个序列,要你判断这个序列能不能通过将其中某个子序列翻转使其成为升序的序列. 我的做法有 ...
- 使用 systemd timer 备份数据库
导读 主要的Linux发行版都改用systemd 来替代 System V启动方式,其中 systemd timer 能替代 crontab 计划任务的大部分功能.本文介绍了用systemd time ...
- 【转】使用genstring和NSLocalizedString实现App文本的本地化
原地址:http://www.cnblogs.com/U-tansuo/p/IOS_NSLocalizedString.html iOS提供了简便的方法来实现本地化,其中用的最多的就是NSLocali ...
- UITextField竖直居中对齐
http://blog.sina.com.cn/s/blog_87533a0801012nv0.html 用xib生成的UITextField文字默认是水平左对齐,垂直居中对齐的,但是用代码生成的UI ...
- System.SysUtils.TMarshaller 与 System.TMarshal
转自:http://www.cnblogs.com/del/archive/2013/06/10/3130974.html TMarshaller(结构) 基于 TMarshal(是有一大堆的 cla ...
- Android 下载文件及写入SD卡
Android 下载文件及写入SD卡,实例代码 <?xml version="1.0" encoding="utf-8"?> <LinearL ...
- Java for LeetCode 073 Set Matrix Zeroes
Given a m x n matrix, if an element is 0, set its entire row and column to 0. Do it in place. 解题思路: ...
- DP:Cheapest Palindrome(POJ 3280)
价值最小回文字符串 题目大意:给你一个字符串,可以删除可以添加,并且每一次对一个字母的操作都带一个权,问你转成回文串最优操作数. 如果这一题我这样告诉你,你毫无疑问知道这一题是LD(Levenshti ...