모달창 버튼 작동 질문드립니다.

[MD]

<div id="modal" class="black-background">
  <div class="white-background">
  <p>로그인 하세요</p>
  </div>
</div>

 

모달창 이렇게 만들었습니다. 선생님 방법대로욤.

 

<a class="btn btn-primary btn-lg" href="#" role="button" id="login-btn">Login</a> 이게 로그인 버튼입니다. id를 login-btn 으로 줬습니다.

 

 

document.getElementById('login-btn').addEventListener('click', function(){
    document.getElementById('modal').style.display = 'block';
});

제이쿼리를 쓰지 않고 자바스크립트로 개발하고 싶어서 이렇게 해봤는데 정상작동을 안 합니다.

 

자바스크립트 코드에 뭔가 문제가 있는건가요?

[MD]

이전에 하던 수업의 자바스크립트 코드 때문에 안 되던거였네요. 계속 같은 파일에 자바스크립트 코드만 추가하면서 하고 있었거든요..

 

Uncaught TypeError: document.getElementById(...) is null

 

콘솔에 이런 에러가 뜨길래 구글링 좀 해보다가 다른 자바스크립트 코드 다 주석으로 하니까 해결이 됐네요.

[글쓴이]

글