2013-09-28 2 views
0

다음은 HTML 페이지입니다. 마우스를 움직이면 텍스트의 색상이 변경됩니다.JavaScript 파일에서 addEventListener 메서드가 작동하지 않습니다.

<html> 
<head> 
    <title>Untitled</title> 
    <script type="text/javascript" src="prjs10_2.js"></script> 
</head> 
<body> 
    <p> This is very <span id="int">interesting</span>!</p> 
</body> 
</html> 

다음은 JavaScript 파일입니다. addEventListener 메서드를 수정해야합니까?

var int = document.getElementById('int'); 

int.document.addEventListener("mouseover", function() { 
int.style.color = "#FF0000";}, false); 

int.document.addEventListener("mouseout", function() { 
int.style.color = "#000000"}, false); 
+0

'document.getElementaryById'가 아닌'document.getElementById'입니다. – Niklas

+0

JavaScript 코드를 디버깅하는 방법에 대해 _really_ 살펴보아야합니다. 적정한 디버깅 툴을 사용하면 오류를 쉽게 발견 할 수 있습니다 (예 : Chrome에서 개발자 콘솔 사용). 그러면 시간이 절약되고 코딩 기능이 향상됩니다. – dirkk

답변

0
  1. 당신은 오자 ElementElementary로이다. 맞춤법을 수정하십시오.이 문제를 해결하기 위해 질문을 편집했습니다.
  2. id="int" 인 요소가 존재하기 전에 document.getElementaryById('int')으로 전화를 걸고 있습니다. 스크립트를 </body> 직전 (또는 적어도 <span id="int">interesting</span> 다음으로)으로 이동하십시오.
  3. HTML 요소 노드에는 document 속성이 없습니다. 이벤트 처리기를 요소에 직접 바인딩하려고합니다. int.document의 모든 인스턴스를 int으로 변경하십시오. 그냥 마우스가 가리키는 요소의 색상을 변경하려면

그러나, 자바 스크립트를 잊고 the :hover pseudo-class를 사용합니다.

1

변경이이에

var int = document.getElementaryById('int'); 

는 :

var int = document.getElementById('int'); 
+0

감사합니다. 콜론에서 ElementById 메서드와 세미콜론을 변경했지만 작동하지 않습니다. 어쨌든 Uncaught TypeError : null의 속성 "document"를 읽을 수 없습니다. –

관련 문제