javascript的getElementsByTagName()的應用

<html>
<head>
<title>getElementByName</title>
</head>
<body>
<form name="from1" action="text.html" method="post">
<input type="text" name="username" value="Id1" id="tid1" οnchange="change()"/><br/>
<input type="text" name="username" value="Id2" id="tid2"/><br/>
<input type="text" name="username" value="Id3" id="tid3"/><br/>
<input type="button" name="ok" value="baocun"/>
</form>
<select name="edu" id="edu">
<option value="博士">博士...</option>
<option value="碩士">碩士...</option>
<option value="本科">本科...</option>
<option value="幼兒園">幼兒園...</option>
</select>
<select name="job" id="job">
<option value="美容">美容...</option>
<option value="IT">IT...</option>
<option value="程序員">程序員...</option>
<option value="建築師">建築師...</option>
</select>
</body>
<script language="JavaScript">

//獲取所有的input元素,返回值是數組


var getElements=document.getElementsByTagName("input");


//測試長度


alert(getElements.length);

//遍歷輸出value的值


//for(var i=0;i<getElements.length;i++){
// var getElement = getElements[i].value;
// alert(getElement);
//}







//輸出type="text"中value屬性的值不包含按鈕(button)


for(var i=0;i<getElements.length;i++){
var getElement = getElements[i];
if(getElement.type!="button"){
alert(getElement.value);
}
}


//輸出所有下拉選id="edu" 中 option標籤中value屬性的值

var optionElement = document.getElementById("edu");
var optionElements = optionElement.getElementsByTagName("option");
alert(optionElements.length);
for(var i=0;i<optionElements.length;i++){
alert(optionElements[i].value);
}


//輸出所有下拉選內容
var optionget = document.getElementsByTagName("option");
alert(optionget.length);
for(var i=0;i<optionget.length;i++ ){

alert("輸出所有下拉選內容:"+optionget[i].value);
}

//輸出下拉選選中的值

alert("選中的值   :"+document.getElementById("edu").value);

</script>
</html

發佈了31 篇原創文章 · 獲贊 0 · 訪問量 3萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章