动态创建表格

效果:动态创建指定行数与列数的表格实现表格隔行变色功能。

一、DOM元素能够在 JavaScript 中实现对文档中元素的添加、修改、删除、克隆、查询等操作;

创建元素:
var element = document.createElement("tagname");
   添加属性:
a. element.setAttribute("name", "value");
b. element. = value;
注意:class 与  className
   获取属性:
a. element.getAttribute("name");
b. element.
   内部内容:
a. element.innerHTML -- 内部HTML文本
b. element.innerText -- 内部纯文本
   添加到某个容器中:
a. parentNode.appendChild(childNode); -- 追加到父容器末尾
b. parentNode.insertBefore(newNode, existNode); -- 将 newNode 所表示节点添加到父容器中已有节点 existNode 之前

二、思路

创建table元素,获取文本框 你想要设置的行数、列数值,利用双重循环,创建tr,td元素,并追加到父元素中。

三、效果图

动态创建表格_第1张图片


四、代码实现



















你可能感兴趣的:(动态创建表格)