DOM模型动态改变Element的值

动态改变表格的值,下拉的值等

下面就是一个简单的动态改变表格的值的一个例子:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">

		<title>改变表格值</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<script type="text/javascript">
   		function change(){
   			var tb = document.getElementById("d");
   			var row = document.getElementById("row");
   			row = parseInt(row.value);
   			//要是输入的不是整数
   			if(isNaN(row)){
   				alert("你要修改的行必须是整数");
   				return false;
   			}
   			var cel = document.getElementById("cel");
   			cel = parseInt(cel.value);
   			//要是输入的不是整数
   			if(isNaN(cel)){
   				alert("你要修改的列必须是整数");
   				return false;
   			}
   			//要是输入的行或列超出表格的行或列
   			if(row>tb.rows.length || cel>tb.rows.item(0).cells.length){
   				alert("要修改的单元格不再该表格内");
   				return false;
   			}
   			var celValue = document.getElementById("value").value;
   			if(celValue==""){
   				alert("请输入要改变的值");
   				return false;
   			}
   			tb.rows.item(row-1).cells.item(cel-1).innerHTML = celValue;
   		}	
   		</script>
	</head>

	<body>
		改变第
		<input id="row" type="text" size="2" />
		行, 第
		<input id="cel" type="text" size="2" />
		列的值为:
		<input id="value" type="text" size="16" />
		<br>
		<input id="change" type="button" value="改变" onclick="change();" />
		<table id="d" border="1">
			<tr>
				<td>
					JAVA
				</td>
				<td>
					Struts2
				</td>
			</tr>
			<tr>
				<td>
					Ajax
				</td>
				<td>
					JAVA EE
				</td>
			</tr>
			<tr>
				<td>
					XML
				</td>
				<td>
					JSP/Servlet
				</td>
			</tr>
		</table>

	</body>
</html>
 

你可能感兴趣的:(JavaScript,html,Ajax,jsp,cache)