<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
span{
border: 1px solid #e85356;
display: inline-block;
302px;
background: #e4393c;
height: 31px;
line-height: 31px;
color: #fff;
font-size: 20px;
font-family: 'Microsoft YaHei';
text-align: center;
cursor: pointer;
}
span:active{
outline: rgb(77,144,254) auto 5px;
}
</style>
<script>
function test(){
/**
* 1:radio checkbox中的获取的属性
*/
// var elements = document.getElementsByName("bank");
// for (var i=0;i<elements.length;i++) {
// console.log(elements[i].name);
// console.log(elements[i].checked);
// console.log(elements[i].disabled);
// }
/**
* 2;type="text" type="password" textarea中获取的属性和方法
*/
// var element = document.getElementById("password");
// //element.disabled=true;//设置为禁用
// //element.readOnly=true;//只读
// element.focus();
/**
* 3;select(option)中获取的属性和方法
*/
var element = document.getElementById("grade");
//console.log(element.selectedIndex);
// var options = element.options;
// //console.log(options[element.selectedIndex].value);
// for (var i=0;i<options.length;i++) {
// console.log(options[i].value+","+options[i].selected+","+options[i].text);
// }
var option=new Option("四年级",'4');
element.add(option);
element.remove(0);
}
</script>
</head
<body>
<form action="http://www.baidu.com">
<input type="radio"name="bank" value="0" />农业
<input type="radio"name="bank" value="1" />工商
<input type="password" id="password" />
<select id="grade">
<option value="1">一年级</option>
<option value="2">2年级</option>
<option value="3" selected="selected">3年级</option>
</select>
<span onclick="test()">提交</span>
</form>
</body>
</html>