摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>表单选择器</title>
<script type="text/javascript" src="../jquery-3.3.1.min.js"></script>
<script>
// 表单选择器
// 语法:
// $(':enabled')所有激活的input元素(可以使用的input元素)
// $(':disabled')所有禁用的input元素(不可以使用的input元素)
// $(':selected')所有被选取的元素,针对于select元素
// $(':checked')所有被选中的input元素
$(document).ready(function(){
$(':enabled').css('background','pink')
$(':disabled').css('background','red')
$(':selected').css('background','#0ff')
$(':checked').parent().css('color','red')
console.log($(':checked').parent())
})
</script>
</head>
<body>
<label >1</label><input type="text"><br>
<label >2</label><input type="text" disabled ><br>
<label >3</label><input type="text"><br>
<label >4</label><input type="text"><br>
<select name="">
<option value="">摩羯座</option>
<option value="" selected>射手座</option>
<option value="">白羊座</option>
<option value="">金牛座</option>
</select>
<hr>
<label for=""><input type="checkbox" name="item">游泳</label>
<label for=""><input type="checkbox" name="item" checked>健身</label>
<label for=""><input type="checkbox" name="item">下棋</label>
<label for=""><input type="checkbox" name="item">唱歌</label>
</body>
</html>
批改老师:灭绝师太批改时间:2018-11-11 09:27:02
老师总结:代码测试的比较全面,可以试着自己找点案例写写看