第七课:通过数组和循环记录信息
http://www.bookofjavascript.com/Websites/AntWeb/antweb.html 最底部例子
1. javascript的内置数组:http://www.cnblogs.com/shanqian/archive/2009/03/11/1408415.html
每个数组都是基于网站的创建者编写的HTML代码而构建的,对于Image数组来说,网页的第一张图像名为images[0],第二张图像名为images[1] ………………
将网页中第一副图像替换成happy.gif: window.document.images[0].src='happy.gif'
网页中包含多少张image: window.document.images.length;
2.小例子:用element[i]来实现全选checkbox
<html>
<head>
<title>Hotmail's Use of Arrays and Loops</title>
</head>
<body>
<form name = "hotmail">
<input type = "checkbox" name = "message1">Message 1<br>
<input type = "checkbox" name = "message2">Message 2<br>
<input type = "checkbox" name = "message3">Message 3<br>
<input type = "checkbox" name = "allbox" onClick = "CheckAll();">Select all displayed messages<br>
</form>
<script type="text/javascript">
function CheckAll()
{
for (var i=0; i<document.hotmail.elements.length;i++)
{
var e = document.hotmail.elements[i];
if (e.name != 'allbox')
e.checked = document.hotmail.allbox.checked;
}
}
</script>
</body>
</html>
小例子:用form+name来实现全选checkbox
<html>
<head>
<title>Hotmail's Use of Arrays and Loops</title>
</head>
<body>
<form name = "hotmail">
<input type = "checkbox" name = "message" value="Message 1">Message 1<br>
<input type = "checkbox" name = "message" value="Message 2">Message 2<br>
<input type = "checkbox" name = "message" value="Message 3">Message 3<br>
<input type = "checkbox" name = "allbox" onClick = "CheckAll(window.document.hotmail);">Select all displayed messages<br>
</form>
<script type="text/javascript">
function CheckAll(thisForm)
{
var count = thisForm.message.length;
checkVal = thisForm.allbox.checked;
for(var loop =0 ; loop<count;loop++){
thisForm.message[loop].checked=checkVal;
}
}
</script>
</body>
</html>
小例子:提示文本框(在一个textarea中每隔几秒钟换一个提示)
<html>
<head>
<title>Arrays and Loops a la Ask.com</title>
</head>
<body onLoad = "startScroll();">
<script type = "text/javascript">
<!-- hide me from older browsers
var tips = new Array("Don't forget to comment your code.", "Beware of infinite loops.", "Program so that other humans can understand what you're doing.");
var num_tips = tips.length;
var index = 0;
while ((num_tips > 0) && (tips[num_tips-1] == ""))
{
--num_tips;
}
function startScroll() {
if (num_tips != null) {
if (window.document.tip_form) {
window.document.tip_form.tip_box.value = tips[index++];
if (index > num_tips - 1)
{
index = 0;
}
}
setTimeout("startScroll()", 3500);
}
}
// show me -->
</script>
<form name = "tip_form">
<textarea name = "tip_box" rows = "3" cols = "30"></textarea>
</form>
</body>
</html>