2010-04-12 4 views
0

이처럼 눈에 거슬리는 자바 스크립트 코드가 작동하지 않아서 왜 작동하지 않는지 알 수 없습니다.Javascript와 CSS가있는 DHTML이 작동하지 않습니다.

div 요소의 className을 동적으로 변경하므로 CSS가 해당 변경 사항을 반영 할 것으로 기대합니다. 그러나 그렇지 않습니다. 다음은 간단한 코드입니다.

HTML :

<head> 
    <title>Your Page</title> 
    <link rel="stylesheet" type="text/css" href="style.css" /> 
    <script type="text/javascript" src="us.js"></script> 
</head> 

<body> 
    <div id="wrapper">  
    <h1 id="title">Your Page</h1> 
    </div> 
</body> 

자바 스크립트 :

CSS
window.onload = function() { 
    document.getElementById("wrapper").className = "2"; 
} 

:

#wrapper{ 
    background-color: white; 
} 

#wrapper.1 { 
    background-color: black; 
} 

#wrapper.2 { 
    background-color: red; 
} 

#wrapper.3 { 
    background-color: blue; 
} 

내가 불을 지르고에서 래퍼 DIV보고는 클래스를 보여줍니다이 변경되는 "2" . 그러나 배경색을 빨간색으로 변경하면 웹 페이지에 반영되지 않습니다. (텍스트 색상을 변경해도 작동하지 않습니다.) CSS가 올바르게로드되고 있음을 알고 있습니다. 문제가 무엇입니까?

+1

클래스 이름은 숫자가 아니어야합니다. –

+0

트릭을 했어! 모두에게 감사드립니다. 내가 본 CSS 튜토리얼 대부분에서 이것이 해결되지 않았다는 것을 믿을 수 없다. –

답변

1

2 잘못된 클래스 이름입니다. 수업 이름은 숫자가 될 수 없습니다. 문자로 시작하는 영숫자 문자열이어야합니다.

4

귀하의 CSS 클래스 이름은이 같은 문자로 시작해야합니다

#wrapper.num1 { 
    background-color: black; 
} 

#wrapper.num2 { 
    background-color: red; 
} 

#wrapper.num3 { 
    background-color: blue; 
}