<head >
<style type="text/css">
/*table中偶数行*/
.tabEven {
background: #ff0000;
}
/*table中奇数行*/
tabOdd {
background: #00ff00;
}
</style>
<script language="javascript" src="jquery-2.1.1.js">
</script>
<script language = "JavaScript" type="text/javascript">
//<![CDATA[
$(document).ready(function() {
$("#bodyText").hide();
$("#bodyText").show("slow");
$("#bodyText").effect("highlight",{}, 8000);
});
</script>
</head>
代码解析：
按照jQuery 的语法，美元符号$是指它本身（而不是其他JavaScript 对象）。我们要向jQuery 传递document 对象，也就是当前文档。然后，使用jQuery 内置的ready()方法，当JavaScript 准备好开始处理事件时，会自动触发这个匿名函数，见后面几个步骤。
$("#bodyText").hide();jQuery 最有用的特性之一是指定要操作的对象的方式。这种方式实际上很像CSS。在编写CSS 规则时，如果希望隐藏id 为bodyText 的元素，可能会编写下面这样的代码：#bodyText { display:none; }
可以看到，CSS 比等效的JavaScript 命令简短得多：document.getElementById("bodyText").style.display = "none";
这一步中代码行的作用与上面的标准JavaScript 和CSS规则的相同：它让浏览器不显示指定的元素它使用jQuery 内置的hide()方法，这个方法不需要参数。
$("#textToggle").toggle(在这里，我们调用另一个jQuery 内置方法：toggle()。前一步中的代码在加载文档时运行，而这一行由某一事件触发——它在单击id 为textToggle 的元素时运行。需要通过参数向toggle()方法传递两个函数，它们分别包含在toggle()的两种状态下应该执行的代码。toggle()方法会记住它的当前状态，所以它会在被触发时自动切换到另一种状态（即运行另一个函数中的代码）。
function() {
$("#bodyText").show("slow");
$("#bodyText").effect("highlight", {}, 2000);
},
这是传递给toggle()的第一个函数。首先，让jQuery 寻找id 为bodyText 的元素，这是在调用show()时要显示的元素。show()方法有一个参数：字符串"slow"，这让jQuery 缓慢地显示出新元素。完成之后，调用jQuery UI 的effect()方法并传递以下3 个参数。
? "highlight"，我们需要的效果。
? {}，所需的效果选项。黄色淡出技术非常流行，所以黄色是默认颜色，因此这里不需要修改
任何选项。
? 2000，希望显示效果的速度。这个值以毫秒为单位，所以2000 意味着希望在两秒内显示淡出效果。图15-2 显示最初的淡出效果，图15-3 显示最终结果。
function() {
$("#bodyText").hide();
}