JavaScript_javascript 팁에서 스타일을 얻기 위한 기본 방법 요약

ps: 스타일을 설정하는 것이 아니라 스타일을 얻는 것입니다. 요소에 스타일 값이 설정되지 않은 경우 브라우저에서 제공한 기본값이 반환됩니다. (포럼 준비)

1. element.style:은 요소 태그의 style 속성에 작성된 스타일 값만 얻을 수 있으며, 로드된 스타일 속성

코드 복사 코드는 다음과 같습니다.

var ele = document.getElementById('ele');
ele.style.color; //색상 가져오기

2. window.getCompulatedStyle():은 현재 요소의 최종 CSS 속성 값을 모두 가져올 수 있습니다.

코드 복사 코드는 다음과 같습니다.

window.getCompulatedStyle("Element", "Pseudo-class");

이 메소드는 두 개의 매개변수, 즉 계산된 스타일을 가져올 요소와 의사 요소 문자열(예: ":before")을 허용합니다. 의사 요소 정보가 필요하지 않은 경우 두 번째 매개변수는 null일 수 있습니다. document.defaultView.getCompulatedStyle("element", "pseudo-class");
를 사용할 수도 있습니다.

코드 복사 코드는 다음과 같습니다.

var ele = document.getElementById('ele');
var styles = window.getCompulatedStyle(ele,null);
styles.color; //색상 가져오기

style.length를 통해 브라우저 기본 스타일 수를 볼 수 있습니다. IE6-8에서는 이 방법을 지원하지 않으므로 이후 방법을 사용해야 합니다. Firefox 및 Safari의 경우 색상이 RGB 형식으로 변환됩니다.

3. element.currentStyle: IE 전용, 현재 요소에 적용된 최종 CSS 속성 값을 반환합니다(외부 링크 CSS 파일, 페이지에 포함된