<!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. A1009

    两个多项式的乘积 两个数组,一个放多项式1,一个放结果 注意:arr2[j+exp]+=arr1[j]*coe; 因为有指数相加相同的情况下需要合并系数 #include<cstdio> ...

  2. linux运维、架构之路-MySQL备份与恢复(四)

    一.备份方式 ①逻辑备份(文件表示:SQL语句) ②物理备份(数据文件的二进制副本) ③基于快照的备份 ④基于复制的备份 二.备份工具 ①mysqldump:原生自带的逻辑备份工具 ②mysqlbin ...

  3. CSS-动画，让图片上的图形有涨起来的效果（逐渐变高）和（逐渐变长）

    效果图: html: <div class="inner3"> <div class="over"> <img src=" ...

  4. react native之使用AsyncStorage 进行数据持久化存储

    新建AsncStorageDemoPage.js import React, {Component} from 'react'; import { StyleSheet, View, Text, Bu ...

  5. React Native 之FlatList 下拉刷新和上拉加载更多

    接上一篇代码: 只修改了FlatListDemo.js里面的代码 import React, {Fragment,Component} from 'react'; import { SafeAreaV ...

  6. window7下docker toolbox 启用数据卷报错： Error response from daemon: invalid mode:

    场景:希望把d:\dockerShare文件夹作为数据卷 ,和docker中的centos镜像生成的容器关联. 原来的命令: docker run -d -it --name=edc-centos7 ...

  7. HDU 6623 Minimal Power of Prime

    Time limit 1000 ms Memory limit 65536 kB OS Windows 中文题意 给一个数n,设将n质因数分解后可以得到 \[n=\prod_{i=1}^{\omega ...

  8. 【bzoj3038】上帝造题的七分钟2

    *题目描述: XLk觉得<上帝造题的七分钟>不太过瘾,于是有了第二部. “第一分钟,X说,要有数列,于是便给定了一个正整数数列. 第二分钟,L说,要能修改,于是便有了对一段数中每个数都开平 ...

  9. Mybatis,模糊查询语句，以及传参数的正确写法

    不多说直接上代码! 接口: public interface CommodityMapper { int deleteByPrimaryKey(Integer productId); int inse ...

  10. os.environ.get（）的用法

    os.environ.get()是python中os模块获取环境变量的一个方法 import os JS_ADDRESS = os.environ.get("PALM_JS_ADDRESS& ...