자바 스크립트를 사용하여 html 대신 CSS 요소 검색

.html 파일 자체에서 CSS 요소를 검색하기 위해 document.querySelector가 작동하는 방식을 이해하지만 .css 파일에서 항목을 검색하는 방법은 무엇입니까?자바 스크립트를 사용하여 html 대신 CSS 요소 검색

내 .css 파일의 예 :

canvas { 
background-color: DarkBlue; 
}

그리고 내가 내의 .js 파일에 있습니다 (I은 HTML을 위해 일 것입니다 알고, 그래서 CSS에 대한 동등한 궁금, 내가 원하지 않는 HTML 파일의 스타일에, 나는) 내 별도의 CSS 파일을 유지하려면 :

var canvas = document.querySelector('canvas');

출처

2017-04-22 DeathPox

html 요소의 CSS 속성을 가져 오시겠습니까? –

'.html 파일 자체 내에서 CSS 요소를 검색하기 위해 document.querySelector가 어떻게 작동하는지 이해합니다. - 분명히 querySelector가하는 일을 이해하지 못합니다. - CSS 선택기를 사용하여 HTML 요소를 검색합니다. 'css 요소'가 아닙니다. - 요소에 대해 "계산 된"CSS를 얻으려면'getComputedStyle' 또는'getDefaultComputedStyle'을 사용하십시오 - 차이점을 이해할 수있는 문서를 참조하십시오. –

'css' 요소는 의사 요소를 제외하고 실제로 존재하지 않습니다. 그것들은 여전히 HTML 요소입니다. 수업을 통해 간단히 선택하고 있습니다. –

당신은 할 수 있지만 당신은 CSS 파일을 구문 분석 싶지 않을 것이다. javascript 즉 캔버스로 요소를 가져온 다음 JS로 해당 요소의 스타일을 얻는 것이 훨씬 좋습니다.

이

이전에 아주 잘 여기에 대답하고 좀 더 쉽게 좋은 기능을 제공했다 : JavaScript get Styles

function getStyle(oElm, strCssRule){ 
    var strValue = ""; 
    if(document.defaultView && document.defaultView.getComputedStyle){ 
     strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule); 
    } 
    else if(oElm.currentStyle){ 
     strCssRule = strCssRule.replace(/\-(\w)/g, function (strMatch, p1){ 
      return p1.toUpperCase(); 
     }); 
     strValue = oElm.currentStyle[strCssRule]; 
    } 
    return strValue; 
} 

var elementFontSize = getStyle(document.getElementById("container"), "font-size");

행운을 빕니다.

출처

2017-04-22 03:15:59 anthonyroberts

자바 스크립트를 사용하여 html 대신 CSS 요소 검색

답변

관련 문제