输入框中的内容不符合要求，怎么提示出来并要求重新输入?

获取失去焦点应用

if语句应用

元素样式操作应用

最终效果图：

css部分，可根据自己的个人喜好设置

 #one,#two {
            float: left;
        }

        #two {
            width: 150px;
            height: 32px;
            font-size: 12px;
            color: blue;
            padding-left: 5px;
            display: none;                   /*先隐藏默认的*/
        }

body部分

<div id="one">
        <strong>密码：</strong><input type="password">
    </div>
    <div id="two">
        请输入密码
    </div>

js部分

<script>
                                                     //获取元素
        var input = document.querySelector('input');
        var div = document.getElementById('two');
                               //当获得和失去焦点时div的显示与隐藏
        input.onfocus = function () {               //获得焦点时
            div.style.display = 'block';
        }
        input.onblur = function () {                //失去焦点时
            if (input.value === '') {
                div.innerHTML = '!请设置密码';
                div.style.color = 'red';
            } else if (input.value.length < 6) {   //判断长度length
                div.innerHTML = 'ⓧ请输入不得小于6位的密码，请重输';
                div.style.color = 'red';
                input.value = '';                //可选择重置或不重置
            } else if (input.value.length > 12) {
                div.innerHTML = 'ⓧ请输入不得大于12位的密码，请重输';
                div.style.color = 'red';
                input.value = '';               //可选择重置或不重置
            } else {
                div.innerHTML = '√密码可用';
                div.style.color = '#18fd1d';
            }
        }

    </script>