Password verification with Java script

Question

I have a password change code on my page. How do I use javascript to compare if the new password entered in the two fields is iguai? Follow my current code:

<!-- Modal 4 -->
    <div class="modal fade" id="password" role="dialog" data-backdrop="false" style=" background: rgba(0,0,0,0.5);">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header">
                    <div class='row'>
					<div class='col-sm-7'>
                            <h4 class="modal-title">Alterar Senha</h4>
                        </div>
                        <form method="post" action="alt_pass.php" enctype="multipart/form-data">
                            <div class='col-sm-2' style="right: 25px;">
                                <td align='center'><button type='submit' class='btn btn-sm btn-warning'>Alterar</button>
							</div>		
                        <div class='col-sm-3'>							
							<form align='center'><button type='button' class='btn btn-sm btn-primary' data-dismiss='modal'>Sair</button>

                            </div>
							</div>

                </div>
                <div class="modal-body">
                    <p>
					<!--Fim Campo Email-->

                            <!--Campo Senha-->
                            <form method="POST">
                                <div class='input-group col-lg-10'>
                                    <div class='input-group-addon'>
                                        <span class='glyphicon glyphicon-question-sign'></span>
                                    </div>
                                    <input type='password' name='senha3' id="senha3" class='form-control' placeholder='Senha Atual' autofocus required></div>
                                <button type="button" class="btn btn-sm glyphicon glyphicon-eye-open " style="background:transparent;border:none;top: -10;margin-bottom: 0px;right: 0px;left: 230px;top: auto;bottom: 30px;"
                                        onclick="mostrar1()"></button>
                            </form>
                            <script>
                                function mostrar1(){
                                    var tipo = document.getElementById("senha3");
                                    if(tipo.type == "password"){
                                        tipo.type = "text";
                                    }else{
                                        tipo.type = "password";
                                    }
                                }
                            </script>
                            <!--Fim Campo Senha-->

                            <!--Campo Senha-->
                            <form method="POST">
                                <div class='input-group col-lg-10'>
                                    <div class='input-group-addon'>
                                        <span class='glyphicon glyphicon-question-sign'></span>
                                    </div>
                                    <input type='password' name='senha4' id="senha4" class='form-control' placeholder='Nova Senha' autofocus required></div>
                                <button type="button" class="btn btn-sm glyphicon glyphicon-eye-open " style="background:transparent;border:none;top: -10;margin-bottom: 0px;right: 0px;left: 230px;top: auto;bottom: 30px;"
                                        onclick="mostrar2()"></button>
                            </form>
                            <script>
                                function mostrar2(){
                                    var tipo = document.getElementById("senha4");
                                    if(tipo.type == "password"){
                                        tipo.type = "text";
                                    }else{
                                        tipo.type = "password";
                                    }
                                }
                            </script>
                            <!--Fim Campo Senha-->
							
							<!--Campo Senha-->
                            <form method="POST">
                                <div class='input-group col-lg-10'>
                                    <div class='input-group-addon'>
                                        <span class='glyphicon glyphicon-question-sign'></span>
                                    </div>
                                    <input type='password' name='senha5' id="senha5" class='form-control' placeholder='Confirme Nova Senha' autofocus required></div>
                                <button type="button" class="btn btn-sm glyphicon glyphicon-eye-open " style="background:transparent;border:none;top: -10;margin-bottom: 0px;right: 0px;left: 230px;top: auto;bottom: 30px;"
                                        onclick="mostrar2()"></button>
                            </form>
                            <script>
                                function mostrar2(){
                                    var tipo = document.getElementById("senha4");
                                    if(tipo.type == "password"){
                                        tipo.type = "text";
                                    }else{
                                        tipo.type = "password";
                                    }
                                }
                            </script>
                            <!--Fim Campo Senha-->
					</p>
                </div>				
            </div>
        </div>
    </div>
    <!--Fim Modal 4 -->

Answer 1

Try it that way

    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    </head>

    <input type="password" id="senha1" />
    <input type="password" id="senha2" />

 <button type="button" onclick="teste()">Valida</button>

    <script>
    function teste(){
    var senha1 = $('#senha1').val();
    var senha2 = $('#senha2').val();
    if(senha1 == senha2){
    alert('As senhas são iguais');
    }else{
    alert('As senhas são diferentes');
    }
    }
    <script>