innerHTML是指标签内的html值,value是form控件当前的值:
首先,先了解一下getElementById() 是多个 JavaScript HTML 方法之一。
本例使用该方法来“查找” id=“demo” 的 HTML 元素,并把元素内容(innerHTML)更改为 “Hello JavaScript”:
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript 能做什么</h2>
<p id="demo">JavaScript 能够改变 HTML 内容。</p>
<button type="button" onclick='document.getElementById("demo").innerHTML = "Hello JavaScript!"'>点击我!</button>
</body>
</html>
注意:这里的innerHTML不能更改为value,
第二个例子通过value获取form控件当前的值(输入输出都是字符串)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>求和计算</title>
<script >
function sum() {
var s=0;
var aa;
for(i=1;i<=5;i++){
aa=parseInt(document.getElementById("a"+i).value);
s=s+aa; }
document.getElementById("he").value=s;
return s;
}
</script>
</head>
<body>
<form>
<input type="text" id="a1" />
</br>
<input type="text" id="a2" />
</br>
<input type="text" id="a3" />
</br>
<input type="text" id="a4" />
</br>
<input type="text" id="a5" />
</br>
<input type="text" id="he" /><input type="button" onclick="sum()" value="求和"/>
</form>
</body>
</html>
注意:我这里通过parseInt,把从form中获取的字符串(值)转换成了整数。
这里的value不能改为innerHTML。
这里用了循环通过Id获取值,代码简洁,返回值为了需要总值时直接调用。
皮卡大人是刚刚学习网页设计的小白,写这些以为了总结提高,和希望帮助其他小白。(欢迎大神指教),博客园我也开通了一个,好像这个好用一些。