반응형
Notice
Recent Posts
Recent Comments
Link
«   2024/05   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Tags more
Archives
Today
Total
관리 메뉴

Life goes slowly...

[Javascript] 자바스크립트(JS)로 CSS 파일 변경하기 본문

프로그래밍/Javascript

[Javascript] 자바스크립트(JS)로 CSS 파일 변경하기

빨강소 2021. 5. 13. 15:16
728x90
반응형

 

 

자바스크립트(Javascript) CSS 파일 변경하기

웹페이지 생성 시 각각 QA서버와 운영서버마다 CSS 파일을 변경해야 할 때가 있습니다.

그럴 때 자바스크립트(Javascript)에서 동적으로 CSS 파일을 변경하는 방법이 있습니다. 방법으로는 link 태그에 ID 값을 할당한 뒤에 해당 ID에 CSS 파일을 변경하는 방법입니다.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <head>
        <title>타이틀</title>
        <link rel="stylesheet" type="text/css" id="changeStyle" href="./test.css" />
        <script type="text/javascript">
            function changeStyle(css)
            {
                var ch = document.getElementById('changeStyle');
                if(ch) {
                	ch.href=('./'+css+'.css'); 
                }
            }
        </script>
    </head>
    <body>
        <h1>타이틀</h1>
        <p>
            <a href="javascript:changeStyle('change1')">change1.css로 변경</a>
            <a href="javascript:changeStyle('change2')">change2.css로 변경</a>
        </p>
    </body>
</html>

 

 

 

728x90
반응형
저작자표시 비영리 변경금지

'프로그래밍 > Javascript' 카테고리의 다른 글

[Javascript] 자바스크립트(JS)의 배열을 합치는 함수 - Join()  (0) 2021.05.24
[Javascript] 자바스크립트(JS) Image 파일 용량 체크  (0) 2021.05.18
[Javascript] Uncaught TypeError: Illegal invocation 해결방법  (0) 2021.05.17
[Javascript] 자바스크립트(JS) file type을 버튼으로 변경하기  (0) 2021.05.14
[Javascript] 자바스크립트(JS)의 배열 중복제거하기  (0) 2021.05.12
[Javascript] 자바스크립트(JS) 세계 Local 시간 구하기  (0) 2021.05.05
[Javascript] 자바스크립트(JS) 부모창 데이터 넘기기 - opener()  (0) 2021.04.06
[Javascript] 자바스크립트(JS) Ctrl+C , Ctrl+V 키 막기  (0) 2021.04.04
'프로그래밍/Javascript' Related Articles more
Comments