目的和要求

学习网页编程，掌握客户端脚本语言 JavaScript 的使用。

内容和步骤

1、编制如下图所示的个人简历表格：
在这里插入图片描述

2、用 JavaScript 脚本语言设计一个简单的验证程序：要求在文本框中输入一个1~100 之间的整数，单击“提交”按钮。若输入正确，则弹出对话框，显示“你输入对了，谢谢！”，如图 3‐12 所示；若输入不正确，则弹出对话框，显示“请输入一个从 1 到 100 之间的数字。”
在这里插入图片描述

代码

个人简历表格

<!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">
    <title>个人简历</title>
    <style>
        table {
            border-collapse: collapse;
        }

        table,
        th,
        td {
            border: 1px solid black;
        }

        th {
            font-family: "楷体";
            font-size: large;
            font-weight: 900;
        }
    </style>
</head>

<body>
    <table>
        <tr>
            <th>姓名</th>
            <td>马卫</td>
            <th>出生日期</th>
            <td>1983.06.04</td>
            <th>性别</th>
            <td>男</td>
            <th>籍贯</th>
            <td>江苏、东台</td>
        </tr>
        <tr>
            <th>学历</th>
            <td>本科</td>
            <th>毕业院校</th>
            <td colspan="2">盐城师范学院</td>
            <th>专业</th>
            <td colspan="2">计算机科学与技术</td>
        </tr>
        <tr>
            <th>家庭地址</th>
            <td colspan="7" style="text-align: center;">江苏省东台市富安镇潘陈村一组5号</td>
        </tr>
        <tr>
            <th>简历</th>
            <td colspan="7">东台是一个很美的小城，我生活在这里，学习在这里，但愿南师大是我人生的一次飞越！一次腾飞！</td>
        </tr>
        <tr>
            <th>通讯</th>
            <td colspan="6">
                <ul>
                    <li>电话：025-5893804</li>
                    <li>Email:<a href="#">maweitian@163.com</a></li>
                    <li>QQ:8928253</li>
                </ul>
            </td>
            <td rowspan="2">
                <img src="个人简历照片.jpg" height="180" usemap="#aaa" />
            </td>
        </tr>
        <tr>
            <th>备注</th>
            <td colspan="6">
                <ul>
                    <li>个人主页:<a href="#">http://home.yctc.edu.cn/mawei</a></li>
                    <li>本班同学名单:<a href="#">Namelist.htm</a></li>
                </ul>
            </td>
        </tr>
    </table>
    <map name="aaa" id="aaa">
        <area shape="rect" coords="0,0,66 ,77" href="#" target="_blank" alt="F" />
        <area shape="circle" coords="80,120,30" href="#" target="_blank" alt="F" />
    </map>
</body>

</html>

js_99">js验证程序

<!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">
    <title>简单验证</title>
</head>
<body>
    <h1>简单验证</h1>
    <hr/>
    <br/>
    请输入一个1到100之间的数字：<input type="number" name="num" id="input"><br>
    <button onclick="onclick1()">提交</button>
    <script>
        var input=document.getElementById("input");
        function onclick1(){
            //alert(input.value);
            if(input.value>=1&&input.value<=100){
                alert("你输入对了，谢谢！");
            }
            else{
                alert("请输入一个从 1 到 100 之间的数字。");
            }
        }
    </script>
</body>
</html>