CSS 규칙 값을 추출하는 방법
사용자가 원하는 형식과 같이 CSS 규칙의 모든 내용을 포함하는 문자열을 어떻게 반환할 수 있습니까? 인라인 스타일로 보셨나요? 규칙의 특정 내용을 알지 못해도 이를 수행할 수 있으므로 스타일 이름으로 추출할 필요가 없습니다.
다음 CSS를 고려하세요.
.test { width:80px; height:50px; background-color:#808080; }
시작하려면 다음이 있습니다. 코드:
function getStyle(className) { var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules for(var x=0;x<classes.length;x++) { if(classes[x].selectorText==className) { //this is where I can collect the style information, but how? } } } getStyle('.test')
scunliffe의 답변을 기반으로 하고 다른 소스에서 적용하면 이 코드를 향상하여 CSS 규칙을 추출할 수 있습니다. 값:
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; } alert(getStyle('.test'));
이 코드는 CSS 규칙을 순회하여 선택기 텍스트가 지정된 클래스 이름과 일치하는지 확인합니다. 각 일치 규칙에 대해 해당 CSS 텍스트를 수집하여 cssText 변수에 누적합니다. 마지막으로, 함수는 원하는 인라인 스타일 형식의 문자열을 제공하여 누적된 CSS 텍스트를 반환합니다.
위 내용은 전체 CSS 규칙 콘텐츠를 문자열로 추출하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!