辛苦老师帮忙检查一下

来源：4-11 编程练习

小雨不大点

2021-04-22 11:14:56

相关代码：

<!DOCTYPE html>
<html>

<head lang="en">
    <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 input = document.getElementsByTagName('input')[0];
        var span = document.getElementsByTagName('span')[0];
        input.onfocus = function () {
            if (input.value.length==0){
                span.innerHTML = '请输入您的姓名';
            }
            span.innerHTML = '';
        }
        input.onblur= function(){
            span.innerHTML = '';
            if (input.value.length==0){
                input.className="red";
                span.innerHTML = '用户名不能为空';
            }
        }
    </script>
</body>

</html>