web写一个用户名和密码的网页

用web编写一个程序，输入用户名和密码，如果用户名为空，弹出提示信息用户名为空，如果密码为空，弹出提示信息密码为空。
![img](https://img-mid.csdnimg.cn/release/static/image/mid/ask/624257164156121.jpg "#left"各位求解。谢谢啦

<!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>Document</title>
</head>

<body>
    <form action="">

        <label>用户名：</label> <input id="username" type="text" /><br />
        <label>密码：</label> <input id="userpass" type="text" /><br />
        <input type="button" onclick="pan()" value="提交">
    </form>

    <script>
        function pan(){
            console.log(document.getElementById("username").value)
            if(document.getElementById("username").value==null||document.getElementById("username").value==""){
                alert('用户名不能为空')
            }
            if(document.getElementById("userpass").value==null||document.getElementById("username").value==""){
                alert('密码不能为空')
            }
        }
            
    </script>


</body>

</html>

img

img


望采纳，谢谢

先获取相对应的值，再判断值是否为空，为空的话弹出错误信息，再retrun掉