![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
PHPzCorrection status：qualified
Teacher's comments：
Collection
Collection
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script><title>Document</title><style></style></head><body><div class="container"><span>请输入用户名：</span><input id="user" type="text" name="" value="请输入用户名"><span>请输入密 码：</span><input id="pwd"type="text" name=""></div><br><div><table border="1" cellspacing="0" cellpadding="0"><thead><tr><td>编号</td><td>名称</td><td>首字母</td><td>拼音</td><td>精度</td><td>纬度</td></tr></thead><tbody></tbody></table></div><script>// 按键松开后（还有按键按下等，具体需要可查阅api文档$('#user').keyup(function(){console.log(123);});// 获取焦点$('#user').focus(function(){$('#user').val("");});// 失去焦点$('#user').blur(function(){$('#user').val("请输入用户名");});// get$.get("http://admin.ouyangke.cn/index.php/api/index/prov_list",{// page:7,limit:20},function(data){let html_data = "";// console.log(data);// console.log(data.data.length);for(let i = 0;i < data.data.length; i++){html_data += "<tr>"html_data += "<td>" + data.data[i].area_id + "</td>";html_data += "<td>" + data.data[i].area_name + "</td>";html_data += "<td>" + data.data[i].first_pinyin + "</td>";html_data += "<td>" + data.data[i].lat + "</td>";html_data += "<td>" + data.data[i].lng + "</td>";html_data += "<td>" + data.data[i].pinyin + "</td>";html_data += "</tr>"}$('tbody').append(html_data);},'JSON');</script></body></html>