CSS 속성을 동적으로 호출하는 js의 작은 규칙과 특수 사례

1. 대시가 없는 CSS 속성의 경우 일반적으로 스타일 속성 이름을 직접 사용합니다.

예: obj.style.margin, obj.style.width, obj.style.left, obj.style.position 등

2. 밑줄이 포함된 CSS 속성의 경우 각 밑줄을 제거하고 각 밑줄 뒤의 첫 번째 문자를 대문자로 바꿉니다.

예: obj.style.marginTop, obj.style.borderLeftWidth, obj.style.zIndex, obj.style.fontFamily 등

float은 Javascript의 예약어인데, js에서는 스타일시트에 float를 어떻게 작성하나요?

obj.style.float를 직접 사용할 수 없으며 이 작업은 유효하지 않습니다.

올바른 사용 방법은 다음과 같습니다: IE: obj.style.styleFloat, 기타 브라우저 Mozilla(gecko), ff 등은 styleFloat: obj.style.cssFloat를 사용합니다.

모든 사람이 쉽게 이해할 수 있도록 예를 들어주세요.

테스트 1

< div onclick="alert (this.style.float);

if(this.style.cssFloat){this.style.cssFloat='left';

}else{this.style .styleFloat='왼쪽';

}alert(this.style.float);">테스트 2