外部スタイルシートの切り替え
通常、外部スタイルシートは<head>部の<link>タグで指定しています。この<link>タグにid属性を付け、Scriptでそのhref属性を変更する。
Sample
以下のボタンを押せば、このページに適用されている外部スタイルシートを切替え、変更し、スタイルが変わります。
| | |
Sample Source......................................................................>>>
<link id="css_file" rel="stylesheet" href="../css_css.css" type="text/css">
</head>
<body>
<button onclick="document.getElementById('css_file').href
='../css01_sample1.css';">スタイル 1</button>|
<button onclick="document.getElementById('css_file').href
='../css01_sample2.css';">スタイル
2</button>|
<button onclick="document.getElementById('css_file').href
='../css01_sample3.css';">スタイル
3</button>|
<button onclick="document.getElementById('css_file').href
='../css_css.css';">元に戻す</button>