上午学的查找裂表框与昨天学的非常相似
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>查找列表框、下拉菜单控件</title>
</head>
<body>
<form action="#">
<select name="city" id="city" size="1">
<option value="beijing">北京</option>
<option value="shanghai" selected>上海</option>
<option value="tianjin">天津</option>
<option value="nabjing">南京</option>
<option value="shenzhen">深圳</option>
<option value="wuhan">武汉</option>
</select><br>
<input type="button" value="第一个城市" onClick="change(‘0‘)">
<input type="button" value="上一个城市" onClick="change(s.selectedIndex-1)">
<input type="button" value="下一个城市" onClick="change(s.selectedIndex+1)">
<input type="button" value="最后一个城市" onClick="change(s.length-1)">
</form>
</body>
<script type="text/javascript">
// var f=document.getElementById("city").form;
// alert(f.action);
//// 获取下拉列表框的select元素对象
// var s=document.getElementById("city");
// alert(s.length);
function first(){
// 获取select元素
var s=document.getElementById("city");
// 获取select中的第一个option元素
var o=s.options[0]
// 获取options中的文本值
alert(o.text);
}
function last(){
// 获取select元素
var s=document.getElementById("city");
// 获取select选中元素的上一个元素
var o=s.options[s.selectedIndex-1];
// 获取options中的文本值
alert(o.text);
}
function next(){
// 获取select元素
var s=document.getElementById("city");
// 获取select选中元素的上一个元素
var o=s.options[s.selectedIndex+1];
// 获取options中的文本值
alert(o.text);
}
function over(){
// 获取select元素
var s=document.getElementById("city");
// 获取select选中元素的上一个元素
var o=s.options[s.length-1];
// 获取options中的文本值
alert(o.text);
}
// 获取select元素
var s=document.getElementById("city");
function change(index){
// 获取select选中元素的上一个元素
var o=s.options[index]; 能简化就简化
// 获取options中的文本值
alert(o.text);
}
</script>
</html>
原文：https://www.cnblogs.com/pandam/p/10709202.html