jk.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="..//BOOSTRAP/bootstrap-5.2.2-dist/css/bootstrap.min.css">
</head>
<style>
    main {
        background-color: rgb(0 0 0.5);
        width: 16em;
        height: 14em;
        margin: auto;
        border-color: cadetblue;
        border-style: dotted;
    }

    button {
        margin-left: 4em;
    }

    #cv:hover {
        background-color: darkgoldenrod;
        color: black;
        transition: all 0.5s ease-in-out;
    }
    main:hover{
        background-color: blanchedalmond;
        transition: all 0.4s ease-in-out;
    }
</style>

<body>
    <main>
        <input class="form-control my-2" id="mts" type="password" placeholder="password">
        <input class="form-control my-2" id="mt" type="password" placeholder="comfirm password">
        <button class="btn btn-warning mt-3" id="cv" onclick="mt()">summit</button>
        <h3 id="iio">hello word</h3>
    </main>
</body>

</html>

<script>
    // let age = 18;

    var inp = document.getElementById("mts")
    var inp1 = document.getElementById("mt")
    function mt() {
        if(inp.value == "" && inp1.value == ""){
             alert("input field cannot be empty")
             return;
           }
        if (inp.value == inp1.value) {
         //   alert("")
            alert("login successful")
            return;
        } else {
            alert("password don't match")
            // if (inp1.value == "") {
            //      alert("input field cannot be empty")
            //      return;
            // }
        }

        console.log(document.getElementById("mts").value);
        console.log(document.getElementById("mt").value);
        // let myinp =(document.getElementById("mt").value);
        document.getElementById("mts").innerHTML = inp
    }

</script>