论坛首页 入门技术论坛

AJAX动态创建表格实例

浏览 2615 次
该帖已经被评为新手帖
作者 正文
   发表时间:2009-02-27  
初学AJAX,把一些学习的点滴记录下来!以备以后参考

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>使用DOM创建HTML表格</title>
<script type="text/javascript">
 function start(){
 //获取body标签
   var body = document.getElementsByTagName("body")[0];
   //创建一个<table>元素和一个<tbody>元素
    table = document.createElement("table");
    tablebody = document.createElement("tbody");
   // 将<tablebody>元素添加到<table>
    table.appendChild(tablebody);
    body.appendChild(table);
    //将表格table的border属性设置为2
    table.setAttribute("border","2");
 }
 function insertRow(){
  //创建一个<tr>
   current_row = document.createElement("tr");
    //创建一个<td>
   current_cell = document.createElement("td");
   //创建一个文本结点
   currenttext = document.createTextNode("单元格");
   //将创建的文本结点添加到<td>里面
   current_cell.appendChild(currenttext);
   //将创建的<td>添加到<tr>里面
   current_row.appendChild(current_cell);
   //将<tr>添加到<tbody>
   tablebody.appendChild(current_row);
 
 }
</script>
</head>
<body onload="start()">
  <input type="button" onclick="insertRow()" value=增加行>
</body>
</html>
论坛首页 入门技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics