JSPRO1/JS HTMLページスタイル全体（Skinning）.html全体を動的に変更します
コードコピーは次のとおりです。
<！doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv = "content-type" content = "text/html; charset = utf-8"/>
<Title>ダイナミックページスタイル</title>
<link href = "css/blue.css" rel = "styleSheet" id = "mylink"/>
<script type = "text/javascript">
function gel（id）{
document.getElementByID（ID）を返します。
}
window.onload = function（）{
// CSSファイルを交換します
var lis = gel（ "ulist"）。子ども;
for（var i = 0; i <lis.length; i ++）{
if（lis [i] .nodetype == 1）{
lis [i] .onclick = function（）{
gel（ "mylink"）。href = "css/" + this.classname + ".css";
};
}
}
};
</script>
</head>
<body>
<div>
<span>ページ全体のスタイルを変更</span> <br/>
<入力型= "text" id = "txt"/>
<入力型= "button" value = "submit"/>
</div>
<ul id = "ulist" style = "テキストゼロ：なし;マージントップ：100px;">
<li style = "display：block; width：30px; height：20px; background-color：red;"> </li>
<li style = "display：block; width：30px; height：20px; background-color：blue"> </li>
</ul>
</body>
</html>
jspro1/css/red.css
コードコピーは次のとおりです。
* {
マージン：0px;パディング：0px;
}
体 {
バックグラウンドカラー：#eeeeee;
}
スパン{
色：赤;
}
＃TXT {
色： "border：1px solid＃7d1515;
}
.btn {
バックグラウンドカラー：＃a52a2a; border：none; color：white; width：100px; height：28px;
}
jspro1/css/blue.css
コードコピーは次のとおりです。
* {
マージン：0px;パディング：0px;
}
体 {
バックグラウンドカラー：#eeeeee;
}
スパン{
色：青;
}
＃TXT {
色：＃0000CD; Border：1PX Solid＃006400;
}
.btn {
バックグラウンドカラー：＃0000CD;境界線：なし;色：白、幅：100px;高さ：28px;
}