<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
function createTable(){
var table = document.createElement("table");
table.border = "1";
table.width = "100%"; //table API
//创建一行
//var tr = table.insertRow(table.rows.length);
//创建单元格
//var td = tr.insertCell(tr.cells.length);
var tr,td;
for(var i=0;i<6;i++){
//循环插入元素
tr = table.insertRow(table.rows.length);
if(i%2 === 0){
tr.style.backgroundColor = "red";
}else{
tr.style.backgroundColor = "green";
}
for(var j=0;j<5;j++){
td = tr.insertCell(tr.cells.length);
td.innerHTML = "第"+i+"行,第"+j+"列";
td.align = "center"; }
} //td.innerHTML = "测试"; document.querySelector("#tb").appendChild(table);
}
</script>
</head>
<body>
<input type="button" onclick="createTable()" value="createTable">
<hr>
<div id="tb"></div>
</body>
</html>

js中创建table表格的更多相关文章

  1. js创建table表格

    //js创建table表格var tr;var cell;for(var i=0;i<10;i++){ //创建一个tr tr=document.createElement('tr'); doc ...

  2. 使用js方法将table表格中指定列指定行中相同内容的单元格进行合并操作。

    前言 使用js方法对html中的table表格进行单元格的行列合并操作. 网上执行此操作的实例方法有很多,但根据实际业务的区别,大多不适用. 所以在网上各位大神写的方法的基础上进行了部分修改以适合自己 ...

  3. js中获取 table节点各tr及td的内容方法

    js中获取 table节点各tr及td的内容方法 分类: java基础2013-10-12 17:54 1055人阅读 评论(0) 收藏 举报 <table id="tb1" ...

  4. JS动态创建Table,Tr,Td并赋值

    JS动态创建Table,Tr,Td并赋值. 成果库修改: 要求主题列表随成果类型改变而改变 网上查询资料后开工,在成果类型下拉框添加change()事件触发Dwr,查询主题集合——动态创建/编辑Tab ...

  5. js中创建html标签、加入select下默认的option的value和text、删除select元素节点下全部的OPTION节点

    <pre name="code" class="java"> jsp 中的下拉框标签: <s:select name="sjx&qu ...

  6. js中的table导出成Excel表格

    首先判断手否是IE,原因在于IE导出我用的是ActiveXObject,判断的方式很简单,只需要拿到window.navigator.userAgent即可进行判断,代码如下 function get ...

  7. JS动态创建table

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  8. js中的 Table 对象

    Table 对象Table 对象代表一个 HTML 表格.在 HTML 文档中 <table> 标签每出现一次,一个 Table 对象就会被创建. Table 对象集合cells[]    ...

  9. js dom 创建table标签和子属性, 以及创建多选框

    代码: <div class="Category"> <span id="Edit_headerTitle">Edit Categori ...

随机推荐

  1. js中字符串处理成数字的方法

    <script> var a="11.1111"; var b="12.2222"; //第一种方法:乘以1的方法 //alert(a*1+b*1) ...

  2. 转载:【Oracle 集群】RAC知识图文详细教程(八)--Oracle 11G RAC数据库安装

    文章导航 集群概念介绍(一) ORACLE集群概念和原理(二) RAC 工作原理和相关组件(三) 缓存融合技术(四) RAC 特殊问题和实战经验(五) ORACLE 11 G版本2 RAC在LINUX ...

  3. Http协议——Header说明

    下图是我用IE的开发人员工具截取的一个Http Request请求的Header. 下图是我用IE的开发人员工具截取的一个Http Response的Header. header常用指令 header ...

  4. 判断设备(PC,安Android,iOS)

    //判断是不是PC function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = new Array("An ...

  5. UVALive 5135 Mining Your Own Bussiness【tarjan点双】

    LINK1 LINK2 题目大意 给你一个无向连通图,让你给一些点染上黑色,需要满足染色之后,断开任意一个节点,要满足任意一个联通块中剩下的节点中至少有一个黑点 思路 一开始想的是把每一个点双联通分量 ...

  6. UsernameToken 【转】

    原文:http://idior.cnblogs.com/articles/381534.html 使用用户名和密码来验证用户的身份是最普通也最常见的方法,虽然在安全性方面也比较弱,由于其运用的广泛性还 ...

  7. 【转】linux tail命令使用方法详解

    原文网址:http://www.111cn.net/sys/linux/46902.htm linux tail命令用途是按照要求将指定的文件的最后部分输出到标准设备,一般是终端,通俗讲来,就是把某个 ...

  8. Phonegap 原生控件(Android)与html混合

    1. 用命令创建cordova项目 cordova coreate hello com.example.hello hello 2.打开MainActivity 在onCreate方法中加入 setC ...

  9. Java中return的语句

    1.return语句的作用:a.返回一个值,这个值可以是任意类型.b.使程序返回到操作系统(即终止程序)2.java中对于一个函数,不论有没有返回值类型,都可以带有return 语句.但是区别在于,r ...

  10. php的静态变量的实现

    1.静态变量的结构 php脚本编译之后会生成执行opcode组成的opcode_array,执行每个zend_op_array都会生成一个单独的zend_execute_data结构. php的局部变 ...