请老师检查是否可以优化?

来源：3-8 编程练习

lily1109

2019-11-18 12:18:19

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>onblur和onfocus</title>
    <style type="text/css">
        .red{
            border:1px solid red;
        }
    </style>
</head>
<body>
    姓名：<input type="text"> <span></span>
    <script type="text/javascript">
        // 补充代码
        var box=document.getElementsByTagName("input")[0],
            tip=document.getElementsByTagName("span")[0];
        // 获得焦点时
        box.onfocus=function(){
            if (this.value=="") {
                tip.innerHTML="请输入您的姓名";
            }
        }
        // 失去焦点时
        box.onblur=function(){
            if (this.value=="") {
                tip.innerHTML="用户名不能为空";
                this.className="red";
            } else {
                tip.innerHTML="";
                this.className="";
            }
        }
    </script>
</body>
</html>

写回答

1回答