原生js验证用户名、登录密码、验证码是否为空的判断

html部分

<form action="" id="logform" method="POST" name="" onsubmit="return validateForm(event)">
    <label for="" class="username">
        <i></i>
        <input type="text" placeholder="用户名或邮箱" name="username" id="username">
    </label>
    <label for="" class="password">
        <i></i>
        <input type="text" placeholder="用户名或邮箱" name="password" id="password">
    </label>
    <label for="" class="code" class="flex">
        <i></i>
        <input type="text" placeholder="验证码" name="code" id="code">
        <span><img src="static/images/code.png" alt=""></span>
    </label>
    <label for="" class=" submit-icons" id="submit-allowed" style="display: block;">
        <input class="submit-btn" type="submit" value="登录">
    </label>
    <div class="forget">
        <a href="user-forget.html">忘记密码？</a>
    </div>
</form>
<div id="tips"></div>

js部分

function validateForm(event) {
    form = event.target;
    event.preventDefault();
    var username = document.getElementById('username');  
    var password = document.getElementById('password');  
    var code = document.getElementById('code');  
    var container = document.getElementById('tips'); 

    if (!username || !username.value.trim()) {
        tips("请输入用户名");  
        return false;
    }  
    if (!password || !password.value.trim()) {
        tips("请输入密码");  
        return; 
    }  
    if (!code || !code.value.trim()) {
        tips("请输入验证码");  
        return;
    }
    form.submit();
}  

function tips(tip){  
    var container = document.getElementById('tips'); 
    container.textContent = tip;  
    container.style.display = 'block';  
    setTimeout(function() {  
        container.style.display = 'none';  
    }, 1000);  
}  

document.getElementById('logform').addEventListener('submit', validateForm);