JSはユーザー登録インターフェース機能を実装します

*{
            マージン: 0;
            パディング: 0;
        }
        。ブロック{
            位置: 相対的;
            マージン: 0 自動;
            上マージン: 80px;
            幅: 710ピクセル;
            高さ: 500px;
            境界線: 1px実線 rgba(29, 29, 29, 0.64);
            背景: url("./img/logo2396.jpg")繰り返しなし;
            背景サイズ: 100%;
        }
        。写真 {
            位置: 絶対;
            zインデックス: 1;
            幅: 710ピクセル;
            高さ: 500px;
            背景色: rgba(0, 0, 0, 0.71);
        }
        .biao{
            上マージン: 20px;
            位置: 絶対;
            zインデックス: 2;
            左マージン: 150px;
        }
        li{
            位置: 相対的;
            パディング左:20px;
            リストスタイル: なし;
            行の高さ: 70px;
            幅: 400ピクセル;
            境界線: 1px 白の実線;
            マージン:5px 自動;
        }
        li 入力[タイプ=テキスト]{
            左パディング: 20px;
            境界線スタイル: なし;
            背景: なし;
        }
        入力[type=submit]{
            左マージン: 150px;
            境界線スタイル: なし;
            フォントサイズ: 25px;
            色: 白;
            背景: なし;
        }
        .d{
            背景色: rgba(222, 53, 3, 0.71);
        }
       。TXT{
           行の高さ: 50px;
           幅: 280ピクセル;
           フォントサイズ: 15px;
           色: 白;
       }
       。エラー {
           位置: 絶対;
           zインデックス: 2;
           左: 150px;
           色: rgba(253, 253, 253, 0.4);
           フォントサイズ: 14px;
       }

<div class="block">
    <div class="写真"></div>
    <div class="biao">
        <フォーム名="フォーム">
            <ul>
                <li><label style="color: white">口座番号:</label><input class="txt" type="text"></li>
                <li><label style="color: white">パスワード:</label><input class="txt" type="text"></li>
                <li><label style="color: white">パスワードの確認:</label><input class="txt" type="text"></li>
                <li><label style="color: white">電話番号:</label><input class="txt" type="text"></li>
                <li><label style="color: white">メールボックス:</label><input class="txt" type="text"></li>
                <li class="d"><input id="sub" type="submit" value="登録"></li>
            </ul>
        </フォーム>
    </div>
</div>

 var sub=document.getElementById("sub");
 var txt = document.getElementsByClassName("txt");
     タグ名によって要素を取得します。
    document.forms.form.onsubmit=関数(){
        ヤン();
        var errl = document.getElementsByClassName("error").length;
        if(!errl){
            true を返します。
        }
        false を返します。
    };
    関数ヤン(){
        for(var i=0;i<txt.length;i++){
            txt[i].focus();
        }
        サブフォーカス();
    }
    (var i=0;i<txt.length;i++) の場合
    {
    txt[i].index=i;
    txt[i].onfocus=関数(){
    this.parentElement.children[2]==undefinedの場合、戻り値:
    this.parentElement.children[2]を削除します。
    };
    txt[i].onblur=関数(){
    スイッチ(this.index) {
        ケース0:
            if(this.value==""){
                var s = document.createElement("span");
                s.innerHTML="口座番号を入力してください";
                s.className="エラー";
                li[this.index].appendChild(s)
            }
            それ以外{
                var s = document.createElement("span");
                s.innerHTML="";
                s.className="成功";
                li[this.index].appendChild(s)
            }
            壊す;
        ケース1:
            if(this.value==""){
                var s = document.createElement("span");
                s.innerHTML="パスワードを入力してください";
                s.className="エラー";
                li[this.index].appendChild(s)
            }
            そうでない場合(この値の長さ<6||この値の長さ>11) {
                var s = document.createElement("span");
                s.innerHTML="パスワードが間違っています";
                s.className="エラー";
                li[this.index].appendChild(s);
               txt[this.index].value="";
            }
             それ以外{
                    var s = document.createElement("span");
                    s.innerHTML="";
                    s.className="成功";
                    li[this.index].appendChild(s)
                }
            壊す;
        ケース2:
            if(this.value==""){
                var s = document.createElement("span");
                s.innerHTML="パスワードをもう一度確認してください";
                s.className="エラー";
                li[this.index].appendChild(s);
                txt[this.index].value="";
            }
            そうでない場合(this.value!=txt[1].value){
                var s = document.createElement("span");
                s.innerHTML="再入力してください";
                s.className="エラー";
                li[this.index].appendChild(s);
                txt[this.index].value="";
            }
            それ以外{
                var s = document.createElement("span");
                s.innerHTML="";
                s.className="成功";
                li[this.index].appendChild(s)
            }
            壊す;
        ケース3:
            if(this.value==""){
                var s = document.createElement("span");
                s.innerHTML="数字を入力してください";
                s.className="エラー";
                li[this.index].appendChild(s)
            }
            そうでない場合(this.value.length!=11){
                var s = document.createElement("span");
                s.innerHTML="数値の形式が間違っています";
                s.className="エラー";
                li[this.index].appendChild(s)
                txt[this.index].value="";
            }
            それ以外{
                var s = document.createElement("span");
                s.innerHTML="";
                s.className="成功";
                li[this.index].appendChild(s)
            }
            壊す;
        ケース4:
            if(this.value==""){
                var s = document.createElement("span");
                s.innerHTML="メールアドレスを入力してください";
                s.className="エラー";
                li[this.index].appendChild(s)
            }
            それ以外{
                var s = document.createElement("span");
                s.innerHTML="";
                s.className="成功";
                li[this.index].appendChild(s)
            }
            壊す;
        }
      }
    }