2010-07-28 6 views
4

jQuery를 사용하여 CSS 클래스를 변경할 수 있습니까?jQuery, CSS 클래스 자체 변경

.my-class{ 
    right:10px;  
} 

을 지금은 $ ("myClass가.")이 클래스의 모든 요소를 ​​선택하지 않고도

.my-class{ 
    right:20px;  
} 

로 변경하려면 : 예를 들어 내가이 클래스가 정의 된 경우. 내가 이것을하고 싶은 이유는 js에서 런타임에 많은 요소를 추가하고 있으며 클래스 정의를 미리 교환하는 것이 좋을 것입니다.

.myClass는 CSS 파일에 정의되어 있습니다. 그렇지 않으면 페이지에 있었지만 jsf/jstl로 정의를 변경했을 수 있습니다.

+0

중복 : http://stackoverflow.com/questions/622122/how-can-i-change-the-css-class-rules-using- jquery – spinon

답변

3

는 반대하지만,보다 가치 당신은 그것을 훨씬 더 많은 일을 찾을 수 있습니다. 이 기사를 읽으면 혼란 스러움을 알 수 있습니다. http://www.quirksmode.org/dom/changess.html

+0

Yuk, 네 말이 맞아. 그건 끔찍한 접근이야. – Elijah

+0

그래, 너무 엉망 이네요. 유용 할 수 있습니다. – edeverett

1

내가 이것을하고 있다면 인라인 스타일로 처리 할 것입니다.

<div style="right:20px"><!-- blank --></div> 

$('div').css('right','10px'); 

다른 옵션은 두 개의 클래스가 있고 당신이 그들을 추가 할 때 두 번째 클래스로 toggleClass()

<div class="right10"><!-- blank --></div> 

$('div').toggleClass('right20'); 
+0

나는 똑같은 말을 할 것이다. 스타일이 너무 가변적이라면 인라인으로 갈 것입니다. 옵션 수가 정해져 있다면 정의하고 토글 할 수 있습니다. –

+0

클래스에는 두 가지 변형 만 있으므로 더 간단합니다. 하지만 난 이러한 요소에 대한 DOM 쿼리하지 싶습니다. 렌더링하는 페이지가 거대합니다. – Elijah

+0

선택자를 구체화하여 작업 속도를 높일 수 있습니다. –

1

두 번째 클래스를 추가하고 요소를 설정하여 그 사이를 전환하는 것입니다? 또는 런타임에 스타일 시트를 교체 할 수 있습니다. 당신이 document.styleSheets를 사용하여 자바 스크립트와 스타일 시트를 편집 할 수있는 기술적

http://www.kelvinluck.com/2006/05/switch-stylesheets-with-jquery/