getElementByName
<!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>
<title>getElementByName的例子</title>
<script type="text/javascript">
function btnClick() {
var radios = document.getElementsByName("gender");
/*//在JS中for(var r in radios)不像C#中的foreach,并不会遍历每个元素,而是遍历的key
for (var r in radios) {
alert(r.value);
}*/
for (var i = 0; i < radios.length; i++) {
var radio = radios[i];
alert(radio.value);
}
}
function btnClick2() {
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
var input = inputs(i);
input.value = "welcome to my room";
}
}
</script>
</head>
<body>
<input type="radio" value="男" />男
<input type="radio" value="女" />女
<input type="radio" value="保密" />保密
<input type="button" value="click" />
<br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="button" value="bytagname" />
</body>
</html>
案例3:
复制代码 代码如下:
getElementByTagName
<!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>
<title>getElementByTagName</title>
<script type="text/javascript">
function initEvent() {
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
var input = inputs[i];
input.onclick = btnClick;
}
}
function btnClick() {
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
var input = inputs[i];
//window.event.srcElement//取得引发事件的控件
if (input == window.event.srcElement) {
input.value = "哈哈"; //以下五个按钮,点到的那个就变为“哈哈”,其余都为“呜呜”,点“呜呜”就变为“哈哈”
}
else {
input.value = "呜呜";
}
}
}
</script>
</head>
<body>
<input type="button" value="欢迎进入" />
<input type="button" value="欢迎进入" />
<input type="button" value="欢迎进入" />
<input type="button" value="欢迎进入" />
<input type="button" value="欢迎进入" />
</body>
</html>
案例4:
复制代码 代码如下: