이 함수가 호출되지 않는 이유는 무엇입니까?

스크립트와 스타일을 마크 업과 분리하려고하지만 onclick 속성에서 벗어날 수 없습니다. Google 및 StackOverflow에서 수행 한 모든 검색에서이 스크립트가 작동합니다. onclick 이벤트를 내 마크 업과 완전히 별도로 만드는 방법은 무엇입니까?이 함수가 호출되지 않는 이유는 무엇입니까?

<!DOCTYPE html> 
<html> 
<head> 
<script> 
document.getElementById('guest_button').onclick = function() { 
    document.write('You\'re a guest!'); 
} 
</script> 
<title>Test</title> 
</head> 

<body> 
    <div id="prompt-container"> 
    <form> 
     <input id="guest_button" type="button" value="Guest"> 
     <input type="button" value="Login"> 
     <input type="button" value="Sign Up"> 
     </form> 
    <div id="test"></div> 
    </div> 
</body> 
</html>

출처

2014-12-11 Zac Canoy

당신은 콘솔에 오류를 가지고해야하기 때문에'document.getElementById를 ('guest_button') ' null를 돌려주었습니다. 그게 너를 인도 했어야 했어. 항상 콘솔을 확인하십시오. –

대상을 지정하려는 DOM 요소가로드 될 때까지 기다렸다가 이벤트를 첨부 할 수 있습니다. 가장 쉬운 방법은 관련 HTML 뒤에 스크립트 태그를 이동하는 것입니다.

<!DOCTYPE html> 
<html> 
<head> 
<title>Test</title> 
</head> 

<body> 
    <div id="prompt-container"> 
    <form> 
     <input id="guest_button" type="button" value="Guest"> 
     <input type="button" value="Login"> 
     <input type="button" value="Sign Up"> 
     </form> 
    <div id="test"></div> 
    </div> 
<script> 
document.getElementById('guest_button').addEventListener("click", function() { 
    alert('You\'re a guest!'); 
}); 
</script> 
</body> 
</html>

주, 나 또한 addEventListener()를 사용하는 동안 코드를 전환하고 문서가 문서를 삭제합니다로드 된 후 document.write() 년부터 alert()로 전환. DOM을 기다리고에 대한 자세한 정보를 들어

은 준비, 그 위에이 답변을 작동하기 전에로드 할 : pure JavaScript equivalent to jQuery's $.ready() how to call a function when the page/dom is ready for it이

가

출처

2014-12-11 22:39:17 jfriend00

이 함수가 호출되지 않는 이유는 무엇입니까?

답변

관련 문제