js小练习：利用getElementsByTagName方法、for循环、this指针、数组实现对多个相同元素value值的改变

来源：互联网发布：网络平台服务协议编辑：程序博客网时间：2024/06/05 03:40

1.练习内容：

在页面中添加三个按钮，当点击按钮时，按钮的值循环发生改变。

例如三个按钮的默认值都为A,当任意点击一个按钮时，其默认值变成B，再次点击变成C，再点一次又变为A.

2.源代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>???????</title>
<style type="text/css">
input{
height:30px;
width:50px;
}

</style>
<script type="text/javascript">
window.onload=function()
{
var i;
var a=document.getElementsByTagName("input");//获取input,返回一个集合
var b=['a','b','c'];

for(i=0;i<a.length;i++)
{
a[i].num=0;//利用for循环对每个元素自定义属性
a[i].onclick=function()
{

this.value=b[this.num]//对元素的value赋值
this.num++;
if(this.num==3)//进行条件判断，使元素value循环
{
this.num=0;
}
};

}

};

</script>
</head>
<body>

<input type="button" value="">
<input type="button" value="">
<input type="button" value="">
</body>
</html>

阅读全文

0 0