Javascript/jQuery의 요소 없이 외부 스타일시트에서 CSS 값을 검색하는 방법은 무엇입니까?

Javascript/jQuery를 사용하여 외부 스타일시트에서 CSS 값 검색

웹 개발에서는 외부 스타일시트에서 CSS 값에 액세스해야 할 수도 있습니다. 해당 HTML 요소가 페이지에 실제로 존재하지 않고. 이 시나리오는 콘텐츠를 동적으로 생성할 때 자주 발생합니다.

일반적으로 사용되는 jQuery 메서드 $('element').css('property')는 페이지에서 렌더링되는 요소에 의존합니다. 그러나 요소가 생성되기 전에 CSS 속성 값을 결정하려면 대체 접근 방식이 필요합니다.

대리 요소 사용

한 가지 해결 방법은 임시, 숨겨진 대리 요소를 찾아 계산된 스타일을 읽습니다. jQuery의 $("

").hide().appendTo("body")는 페이지 본문에 숨겨진 단락 요소를 생성합니다. 그런 다음 $p.css("color")를 호출하여 CSS 색상 속성 값을 검색할 수 있습니다.

예제 코드

// Scoping function to avoid creating a global
(function() {
    var $p = $("<p></p>").hide().appendTo("body");
    console.log($p.css("color"));
    $p.remove();
})();

참고: 이 예에서 외부 CSS 파일은 원하는 스타일 속성으로 "p" 요소를 정의해야 합니다.

위 내용은 Javascript/jQuery의 요소 없이 외부 스타일시트에서 CSS 값을 검색하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!