Password-Validator/App.js at main · hammadliaquat77/Password-Validator · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91

document.getElementById('text').addEventListener('input', function() {
    let input = this.value;
    let para = document.querySelector('.para');

    para.innerHTML = `
        <p id="Number"> <img src="img/1.png" alt="" id="img"> 1 Number (0-9)</p>
        <p id="Letter"> <img src="img/1.png" alt="" id="img1"> 12 Letter</p>
        <p id="Special"> <img src="img/1.png" alt="" id="img2"> 1 Special Character</p>
        <p id="Uppercase"> <img src="img/1.png" alt="" id="img3"> 1 Uppercase Letter</p>
        <p id="Lowercase"> <img src="img/1.png" alt="" id="img4"> 1 Lowercase Letter</p>
    `;

    let number = false;
    let letter = false;
    let special = false;
    let uppercase = false;
    let lowercase = false;


    for (const x of input) {


        let herry = x;
        if (!isNaN(herry) && herry !== ' ') {
            number = true;
        } else if (/[a-zA-Z]/.test(herry)) {
            letter = true;
            if (herry === herry.toUpperCase()) {
                uppercase = true;
            } else if (herry === herry.toLowerCase()) {
                lowercase = true;
            }
        } else if (/[^a-zA-Z0-9]/.test(herry)) {
            special = true;
        }
    }

    if (number) {
        document.getElementById('Number').style.color = 'white';
        document.getElementById('img').src="img/2.png"
        document.getElementById('Number').style.background = 'blue';

    }
    if (letter) {
        document.getElementById('Letter').style.color = 'white';
        document.getElementById('Letter').style.background = 'blue';
        document.getElementById('img1').src="img/2.png"


    }
    if (special) {
        document.getElementById('Special').style.color = 'white';
        document.getElementById('Special').style.background = 'blue';
        document.getElementById('img2').src="img/2.png"

    }
    if (uppercase) {
        document.getElementById('Uppercase').style.color = 'white';
        document.getElementById('Uppercase').style.background = 'blue';
        document.getElementById('img3').src="img/2.png"

    }
    if (lowercase) {
        document.getElementById('Lowercase').style.color = 'white';
        document.getElementById('Lowercase').style.background = 'blue';
        document.getElementById('img4').src="img/2.png"

    }
});


// Mdn example .test() method

// const str = "hello world!";
// const result = /^hello/.test(str);

// console.log(result); // true