十五、层叠样式表（CSS）
1. 应用样式表（Applying Stylesheets）
Q：我如何在页面上应用另外一个样式表？
A：浏览器通过一个或者多个LINK命令（主要是在页面的HEAD区域）加载样式表（CSS文件），例如：
<LINK rel="stylesheet" type="text/css" href="styleA.css"> <LINK rel="stylesheet" type="text/css" href="styleB.css"> <LINK rel="stylesheet" type="text/css" href="styleC.css">
JavaScript通过使用集合document.styleSheets访问样式表。你可以通过将document.styleSheets[i].disabled的值设为false来应用一个样式表。将disabled设为ture就可以禁用那些你当前不需要的样式表。下面的函数应用第i个样式表，而禁用其他所有的样式表：
function applyStyle(k) {
if (document.styleSheets) {
var nStyles = document.styleSheets.length;
for (var i=0;i<nStyles;i++) {
if (i==k) document.styleSheets[i].disabled = false;
else document.styleSheets[i].disabled = true;
}
}
}
现在试一下（译者注：可以在原文上测试）：
应用样式A（蓝色文本）——调用applyStyle(0)
应用样式B（灰色文本）——调用applyStyle(1)
应用样式C（黑色文本）——调用applyStyle(2)
2. 鼠标指针样式（Mouse Cursor Styles）
Q：如何通过JavaScript改变鼠标指针样式？
A：当今多数浏览器支持一下指针样式（将鼠标移动到样式名称上以观察指针样式改变为那个样式）：
auto move no-drop col-resize all-scroll pointer not-allowed row-resize crosshair progress e-resize ne-resize default text n-resize nw-resize help vertical-text s-resize se-resize inherit wait w-resize sw-resize
在Windows Internet Explorer 6.0或者更新版本，上面的指针样式如下：
要通过脚本改变某一个元素的鼠标指针样式，你可以把元素的属性element.style.cursor设为上面的任何一个值。（另外一种不用JavaScript的方法，可以在元素的HTML标签中使用属性style="cursor:value;"）：
function setCursorByID(id,cursorStyle) {
if (document.getElementById) {
if (document.getElementById(id).style) {
document.getElementById(id).style.cursor=cursorStyle;
}
}
}
在下面的演示中你可以为高亮元素（Element 1 和 Element 2）改变指针样式。在这个例子中，当你点击超链接help, wait, crosshair, text, default, move, 或者 pointer时，指针就会被在整个高亮元素上改为相应的样式，上面的例子中函数setCursorByID将会被使用到。当你点击超链接auto时，特定元素的指针就会被浏览器改为原来的样式。
Element 1 Change cursor to any of these styles: help wait move crosshair text default pointer auto Element 2 Change cursor to any of these styles: help wait move crosshair text default pointer auto
