묻고답하기
자바스크립트를 이용해서 문서의 스타일시트 속성을 변경시켜려합니다
2003.02.25 18:20
자바스크립트를 이용해서 문서의 스타일시트 속성을 변경시켜려합니다.
그런데 대부분의 속성은 "-"(데쉬)로 구분이 되어있지만 자바스크립트에서는 그 데쉬를 인식하지 못하고 있습니다.
실례로 body의 text-align의 값을 변경하려고 아래와 같이 작성하였지만
"'align'(이)가 정의되지 않았습니다." 라는 메세지가 뜨네요..
-------------------------------
document.body.style.text-align = 'center';
-------------------------------
background-image나 background-color와 같은 경우에는 둘다 background라는 속성을 사용하였지만,
위와 같은 text-align이나 margin-top같은 것은 어떻게 처리를 해야할까요?
그런데 대부분의 속성은 "-"(데쉬)로 구분이 되어있지만 자바스크립트에서는 그 데쉬를 인식하지 못하고 있습니다.
실례로 body의 text-align의 값을 변경하려고 아래와 같이 작성하였지만
"'align'(이)가 정의되지 않았습니다." 라는 메세지가 뜨네요..
-------------------------------
document.body.style.text-align = 'center';
-------------------------------
background-image나 background-color와 같은 경우에는 둘다 background라는 속성을 사용하였지만,
위와 같은 text-align이나 margin-top같은 것은 어떻게 처리를 해야할까요?
BODY { text-align: center; }
위의 걸 자바스크립트로 표현하면 다음처럼 됩니다.
document.body.style.textAlign = "center";
대부분의 경우, -가 없을 때는 스타일/자바스크립트 동일하며
-가 있을 경우는 -를 없앤 후 -다음을 대문자로 처리해 주시면 대부분 잘 통할 거에요.
(일부 스타일시트에서 제공하지 않는 속성과 몇가지 속성은 제외)
즉 text-align = textAlign, background-color = backgroundColor, margin-top = marginTop
이런 식으로 자바스크립트에서 기술해 주면 대부분 잘 통할 거에요.
좀더 자세한 사항을 원하시면 MS Web Workshop을 참고하세요.