JavaScript Password Strength Effect instance

---restore content starts---

HTML code

  <inputtype= "text"type= "Password"ID= "IPT">  <BR>  <BR>  <BR>  <H2>Password strength</H2>  <span></span>  <span></span>  <span></span>

CSS Code

    input{      width:400px;      height:50px;      font-size:22px;    }    span{      Display:inline-block;      width:100px;      height:25px;      border:1px solid #333;    }

JavaScript code

    Get the Password box let  ipt=document.queryselector (' #ipt ');    Ipt.onkeyup=function () {let      val=ipt.value;   Gets the input value let      numreg=regexp (/[0-9]/);   Determine if there is a digital let      aaareg=regexp (/[a-z]/);   Determine if there is a lowercase character let      aaareg=regexp (/[a-z]/);   Determine if there are uppercase characters      //regular judgment let      num,aaa,aaa;      Numreg.test (val)? Num=true:num=false;      Aaareg.test (val)? Aaa=true:aaa=false;      Aaareg.test (val)? Aaa=true:aaa=false;            Make an array of the results let      result=[num,aaa,aaa];      Let Len=result.length;      There are several types of let      type=0 defined;      for (let i=0;i<len;i++) {        if (Result[i]) {          type++;        }      }      Render span let      span=document.getelementsbytagname (' span ');      Span[type-1].style.backgroundcolor= "#ff6600";    }

The idea is to judge whether there are certain characters according to the regular ... Page is not beautiful please magnanimous first write

---restore content ends---

JavaScript Password Strength Effect instance