런타임에 CSS 파일을 편집하거나 수정할 수 있습니까?

Question

클래스 이름이 "changebackgroundcolor"인 스타일 시트가 있습니다. 색상이 변경 될 런타임에 CSS 클래스에서 변경을 원합니다.

.changebackgroundcolor{ 
background-color: #21606E;} 

내 색상 선택기에서 배경 코드를 변경하면 영구적으로 변경됩니다.

이 또는 모든 asp.net 코드에 대한 jquery가 있습니다.

내가 이것을 어떻게합니까?

Answer 1

가 편집하거나 런타임에 CSS를 파일을 수정 가능 : 관련이 SO 트릭을 할 수있는 jQuery plugin에 대한 링크와 함께 스레드 발견하셨습니까?

가능하지만 권장하지 않습니다. 당신이 제안하는 것은 파일 편집기로 asp.net 응용 프로그램을 만드는 것입니다.그렇게하려면 응용 프로그램의 보안 컨텍스트 (실행되는 사용자)에 대한 권한을 높여서 큰 웜을 열어야합니다.

가장 간단한 대안은 새 <style type="text/css"> 요소를 동적으로 생성하려는 CSS 클래스가 포함 된 페이지에 작성하여 asp.net 페이지에 클래스를 주입하는 것입니다.

는 예를 들어, 다음의 background-colorUserSettings A와 테이블 (또는 다른 사용자 별 지속성 메커니즘)을 저장할 수있는이처럼 .aspx 페이지에로드 :

<style type="text/css"> 
    .changebackgroundcolor { 
     background-color: <%= user.BackgroundColor %>; 
    } 
</style> 

아니면을 유지할 수 CSS 파일의 클래스 정의. 클래스을 페이지에 직접 내보내는 대신 동적으로 일부 jQuery 코드를 작성하여 다른 답변의 예제를 따라 클래스 정의를 변경하십시오.

Answer 2

존재하는 CSS 클래스를 변경할 수 없습니다. 하지만 당신이 그것을 다시 정의 할 수 있습니다 - 당신의 새로운 클래스와 같은 뭔가 머리에 새 <style></style>을 추가 비판에 대한

$('head').append('<style>YOUR NEW STYLE</style>'); 

참고 : 음, 저자는 전체 스타일 정의를 변경하는 방법에 대해 묻습니다. 특정 요소의 설정을 무시하는 방법이 아닙니다 (jQuery CSS 함수로 수행 할 수있는 작업은 물론).

내 조언 : 다른 배경 색상으로 두 개의 서로 다른 클래스를 만든 다음 사용 JQuery와의 클래스 "changebackgroundcolor"모든 요소를 ​​/ removeClass

Answer 3

를 변경할 수있는 추가 사용

$(".changebackgroundcolor").css("background-color", "#21606E"); 

이 소요됩니다 페이지가 새로 고쳐질 때까지 효과가 있지만 .css 파일에는 저장되지 않습니다.

Answer 4

DOM (예 : jQuery)을 조정하면 변경 사항을 영구적으로 적용 할 수 없습니다. 각 변경 사항에 대해 CSS 파일을 다시 작성하거나 HTML 파일 또는 jQuery 코드의 스타일 섹션을 각 히트마다 동적으로 생성해야합니다.

Answer 5

런타임에 CSS 스타일을 추가, 제거 및 수정할 수 있습니다. Here은 간략한 개요이며 jQuery 설명서도 매우 유용합니다.

Answer 6

은 내가 CSS의 정의 자체를 수정하는 방법을 잘 모르는 것 같아요,하지만 당신은 클래스에 따라 수정할 수 있습니다

$('.changebackgroundcolor').css('background-color', '#21606e'); 

기본으로 돌아가려면

가 사용

$('.changebackgroundcolor').css('background-color', ''); 

이 경우 그것은 분명하지 않다 - "changebackgroundcolor"의 클래스가 그 변화의 객체 모두

<span id="mySpan" class="changebackgroundcolor"></span> 

나처럼 스타일 속성을 추가합니다.

업데이트는 : jQuery equivalent of YUI StyleSheet Utility?