<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
</head>
<body>
<label>考号</label>
<p>
<input type="text" id="kh1">
<input type="button" value="查询">
</p>
<p>
<br/>
</p>
<table width="200" border="1">
<tr>
<td>状况</td>
<td>成绩</td>
</tr>
<tr>
<td id="zk1"> </td>
<td id="cj1"> </td>
</tr>
</table>
<p> </p>
<div id="data">
<label>001</label>
<label>92</label>
<br>
<label>002</label>
<label>56</label>
<br>
<label>003</label>
<label>63</label>
<br>
<label>004</label>
<label>87</label>
<br>
<label>005</label>
<label>65</label>
<br>
<label>006</label>
<label>57</label>
<br>
<label>007</label>
<label>89</label>
<br>
<label>008</label>
<label>48</label>
<br>
<label>009</label>
<label>77</label>
<br>
<label>010</label>
<label>66</label>
<br>
</div>
<script src="./jquery-1.12.4.min.js"></script>
<script>
window.onload = function () {
// $("input[value=查询]").click(function () {
// let num = $(`label:contains(${$("#kh1").val()})`).next().text()
// $("#cj1").text(num);//添加成绩
// if (num < 60) {//比较
// $("#zk1").text("不及格");
// } else if (num < 70) {
// $("#zk1").text("及格");
// } else if (num < 80) {
// $("#zk1").text("中等");
// } else if (num < 90) {
// $("#zk1").text("良好");
// } else {
// $("#zk1").text("优秀");
// }
// })
//方法二
$("input[value=查询]").click(function () {
let value = $("#kh1").val();
let reg = /^00?d{1}0?$/;
let score = $("label:contains(" + value + ")").next().text();
let level = "";
switch (parseInt(score / 10)) {
case 9:
level = "优秀";
break;
case 8:
level = "良好";
break;
case 7:
level = "中等";
break;
case 6:
level = "及格";
break;
default:
level = "不及格"
break;
}
if (!reg.test(value)) {
$("#zk1").text("查无此人");
$("#cj1").text("");
} else {
$("#cj1").text(score); //添加成绩
$("#zk1").text(level); //添加等级
}
})
}
</script>
</body>
</html>