CSS 규칙 값을 추출하여 인라인 스타일로 반환하려면 어떻게 해야 합니까?

CSS 규칙 값 추출

CSS 규칙의 값을 추출하여 인라인 스타일 형식으로 반환하려면 보편적인 접근 방식이 필요합니다. 여기에는 모든 CSS 규칙을 탐색하고 해당 선택기를 기반으로 대상 규칙을 식별하는 작업이 포함됩니다.

다음 CSS를 고려하세요.

.test {
    width: 80px,
    height: 50px,
    background-color: #808080;
}

아래 코드 스니펫은 "에 대한 값을 추출하는 방법을 보여줍니다. 테스트" 규칙:

function getStyle(className) {
    var cssText = "";
    var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
    for (var x = 0; x < classes.length; x++) {        
        if (classes[x].selectorText == className) {
            cssText += classes[x].cssText || classes[x].style.cssText;
        }         
    }
    return cssText;
}

var rules = getStyle('.test');

이제 cssText 변수에는 ".test" 규칙은 인라인 스타일로 선언된 것처럼 보입니다. 이 접근 방식은 다목적이며 내용에 관계없이 모든 CSS 규칙에 사용할 수 있습니다.

위 내용은 CSS 규칙 값을 추출하여 인라인 스타일로 반환하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!