jQuery .css()는 IE 6,7,8 및 Firefox에서 작동하지 않지만 Chrome, Safari, Opera에서 작동합니다.

Question

업데이트 :이 제품은 해결되었습니다.

스타일 시트를 편집 할 수 없기 때문에 JavaScript를 통해 Assistly 사이트의 기본 스타일을 변경하려고합니다. Chrome, Safari, Opera 및 IE9에서 정상적으로 작동합니다. IE 6,7,8이나 Firefox에서는 그렇지 않습니다.

아래 코드에서 h2 및 이미지를 설정하는 처음 두 줄은 모든 브라우저에서 작동하지만 .css() 줄은 작동하지 않습니다. .css()가 특정 브라우저에서 작동하지 않는 이유는 무엇입니까?

다음은 코드입니다. IE에서

<script type="text/javascript"> 
jQuery(document).ready(function(){ 
$("#support-header .wrapper h2").first().html('<h2>Real Estate Help</h2>'); 
$("#company-header .wrapper").html('<a href="http://help.mysite.com/"><img src="http://www.mysite.com/logo-red.png" /></a>'); 
$("body").css({'background': '#FFFFFF !important'}); 
$("#company-header").css({'background': 'none !important'}); 
$("#support-header").css({'background': 'none !important', 'border-bottom': 'none', 'padding': '0'}); 
$("#company-support-portal").css({'background-image': 'url(http://www.mysite.com/container-bg2.jpg) !important', 'background-repeat': 'repeat-x', 'margin-top': '10px'}); 
}); 
</script> 

Answer 1

는, 당신이 다음 각 속성에 대한 별도의 행이 필요하지만

element.css('property', 'value') 

를 사용하여 잘 작동합니다.

참고 : 코드에서 !important를 제거

$.('#elid').css('display', 'block !important') 

Answer 2

쉽게 중요한 지정할 수 있습니다. !important은 인라인 속성이 아닌 스타일 시트 내에서만 사용해야합니다.

Answer 3

나는 다른 사람들의 의견에 덧붙일 것이다 : 나는이 문제가 !important 플래그와 관련이 있다고 생각한다.

질문은 왜 필요합니까? 어쨌든 다른 스타일을 덮어 써야하는 인라인 스타일로 설정하고 있습니다. 인라인 스타일에서 기본적으로 재정의되지 않는 유일한 것은 !important으로 표시된 또 다른 스타일입니다. 그래서 나는 그것이 당신이하려는 것을 가정합니다.

!important을 사용하자마자 기본적으로 브라우저에이 스타일이 다른 모든 것들보다 우선해야한다고 말합니다. 상속 및 우선 순위가 창 밖으로 나옵니다.

동일한 요소에 여러 개의 !important 스타일이있는 경우 둘 다 동일한 우선 순위를 가지므로 어떤 일이 발생하는지 절대 확신 할 수 없습니다. 일부 브라우저는 하나를 선택하고 다른 브라우저는 선택합니다.

절대적인 피할 수없는 경우를 제외하고는 !important을 스타일 시트에서 사용하지 않는 것이 좋습니다. 그리고 확실히 덮어 쓰려는 것이 없도록하십시오.

CSS가 우선 순위와 상속 순서대로 정리하는 방식 때문에 사실 !important이 실제로 필요한 경우는 거의 없습니다. 거의 항상 대안적인 (더 나은) 방법이 있습니다.

따라서 짧은 대답 : 스타일 시트를 다시 작업하여 !important 마커를 제거하십시오. jQuery 코드가 제대로 작동하지 않을 때까지 jQuery 코드가 제대로 작동하지 않습니다 (사실, 사이트의 !important 마커 수를보고 있으면 CSS 자체가 이미 제대로 작동하지 않을 수 있습니다)