[javascript] .css () 함수로 추가 된 스타일을 어떻게 제거 할 수 있습니까?
jQuery로 CSS 를 변경 하고 입력 값을 기준으로 추가하는 스타일을 제거하고 싶습니다.
if(color != '000000') $("body").css("background-color", color); else // remove style ?어떻게해야합니까?
위의 선은 색상 선택기를 사용하여 색상을 선택할 때마다 (예 : 마우스가 색상환 위로 움직일 때) 실행됩니다.
두 번째 참고 : CSS 파일 css("background-color", "none")에서 기본 스타일을 제거하기 때문에이 작업을 수행 할 수 없습니다 . jQuery 에 의해 추가 된 인라인 스타일
을 제거하고 싶습니다 .background-color
답변
속성을 빈 문자열로 변경하면 작업을 수행하는 것처럼 보입니다.
$.css("background-color", "");답변
허용 된 답변 은 작동하지만 style테스트에서 DOM에 빈 속성을 남깁니다 . 큰 문제는 없지만 모든 것을 제거합니다.
removeAttr( 'style' );이것은 모든 동적 스타일을 제거하고 스타일 시트 스타일로 돌아 가기를 원한다고 가정합니다.
답변
jQuery를 사용하여 CSS 속성을 제거하는 방법에는 여러 가지가 있습니다.
1. CSS 속성을 기본 (초기) 값으로 설정
.css("background-color", "transparent")MDN의 CSS 속성에 대한 초기 값을 참조하십시오 . 여기서 기본값은 transparent입니다. inherit여러 CSS 속성을 사용 하여 부모로부터 특성을 상속 할 수도 있습니다 . CSS3 / CSS4, 당신은 또한 사용할 수 있습니다 initial, revert또는 unset그러나이 키워드는 제한된 브라우저 지원이있을 수 있습니다.
2. CSS 속성 제거
빈 문자열은 CSS 속성을 제거합니다. 즉
.css("background-color","")그러나 jQuery .css () documentation에 지정된대로 이것은 속성을 제거하지만 background를 포함한 특정 CSS 속기 속성에 대해 IE8과 호환 문제가 있습니다.
스타일 속성 값을 빈 문자열로 설정하면 (예 : $ ( ‘# mydiv’). css ( ‘color’, ”)) HTML 스타일에 관계없이 해당 속성이 요소에 이미 적용된 경우 해당 속성을 제거합니다. 속성, jQuery의 .css () 메소드 또는 스타일 속성의 직접적인 DOM 조작을 통해. 그러나 스타일 시트 또는 요소에서 CSS 규칙으로 적용된 스타일은 제거하지 않습니다. 경고 : 주목할만한 예외는 IE 8 이하의 경우 테두리 또는 배경과 같은 속기 속성을 제거하면 스타일 시트 또는 element에 설정된 내용에 관계없이 해당 스타일을 요소에서 완전히 제거한다는 것입니다 .
3. 요소의 전체 스타일 제거
.removeAttr("style")답변
순수한 JavaScript의 방법을 알려주기 위해 순수한 JavaScript로 스타일 속성을 제거하는 방법을 얻었습니다.
var bodyStyle = document.body.style;
if (bodyStyle.removeAttribute)
bodyStyle.removeAttribute('background-color');
else
bodyStyle.removeProperty('background-color');답변
이것은 완전한 태그를 제거합니다 :
$("body").removeAttr("style");답변
이 jQuery 함수 중 하나가 작동해야합니다.
$("#element").removeAttr("style");
$("#element").removeAttr("background-color") 답변
그냥 사용 :
$('.tag-class').removeAttr('style');또는
$('#tag-id').removeAttr('style');