[에러].submit() is not function - form 객체 submit()이 안될 때

<script type="text/javascript">
    window.onload = function(){
        document.querySelector("input[type=button]#button1")
        .addEventListener("click", function(){
            var pw = document.querySelector("input[type=password]#pw").value;
            var pw2 = document.querySelector("input[type=password]#pw2").value;
            
            console.log(pw + pw2);
              
            if(pw == pw2){
                document.form1.submit();
            }
        });
    }
</script>

<form name="form1" action="${contextPath}/member/join" method="post">
    id : <input type="text" name="id" required="required"/>
    pw : <input type="password" id="pw" name="pw" required="required"/>
    pw 확인 : <input type="password" id="pw2" required="required"/>
    <input type="button" id="submit" value="입력"/>
</form>

비밀번호 두개를 비교하여 같으면 submit하는 스크립트이다.

하지만 이 상황에서는 submit이 함수가 아니라며 submit이 되지 않는다..

그 이유는 20번 줄에 버튼의 id에 submit이라는 값을 주었기 때문... submit이라는 값을 주지 않으면 정상적으로 동작한다..