다음 HTML이 있다고 가정합니다.
...
<div class="thinger">...</div>
<div class="thinger">...</div>
<div class="thinger">...</div>
...
모든 사물 div의 너비를 동적으로 설정하고 싶습니다. 다음과 같이 할 수 있다는 것을 알고 있습니다.
$(".thinger").css("width",someWidth);
그러면 다음과 같은 html이 생성됩니다.
<div class="thinger" style="width: 50px;">...</div>
<div class="thinger" style="width: 50px;">...</div>
<div class="thinger" style="width: 50px;">...</div>
결과 HTML이 다음과 같이 보이기를 원합니다.
...
<style>
.thinger {
width: 50px;
}
</style>
...
<div class="thinger">...</div>
<div class="thinger">...</div>
<div class="thinger">...</div>
...
나는 둘러 보았지만 기존 CSS 클래스를 추가 / 업데이트 / 수정하는 jQuery 유틸리티를 보지 못했습니다. 존재합니까?
다음과 같이 수동으로 추가 할 수 있다는 것을 알고 있습니다.
var styleElement = document.createElement('style');
styleElement.type = "text/css";
styleElement.innerHTML = ".thinger {width:" + maxWidth + ";}";
document.getElementsByTagName('head')[0].appendChild(styleElement);
그러나 저는 브라우저 불일치를 처리 할 필요가 없으며 "jQuery 방식"을 수행하고 있는지 확인하고 싶습니다. 다른 방법보다 한 가지 방법을 선택해야하는 이유가 있습니까?
DOM의 다른 style요소와 마찬가지로 요소를 만들고에 추가 할 수 head있지만 시간 낭비입니다.
사용하는 가장 좋은 방법은 스타일 시트에 클래스 규칙을 설정하고 해당 요소에 클래스를 추가하는 것입니다. 이렇게하면 나중에 코드 재사용과 유지 관리에 도움이되는 우려 사항을 더 잘 분리 할 수 있습니다.
런타임 전에 너비가 무엇인지 모르기 때문에 스타일 시트에서 클래스 규칙을 설정할 수 없습니다.
이 경우 현재 사용중인 방법이 css()가장 적합합니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다