首先回答是，不是必须是hover。
这个addClass里写hover是因为之前的CSS类选择器的名称是hover（就是.hover {background:red}）。这个名称可以改成别的。下边给你一个可以工作的代码：
<html><head>
<title>hover demo</title>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<style>
.myStyle {
background: red
}
</style>
</head>
<body>
<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
<script>
$("td").hover(function() {
$(this).addClass("myStyle")
}, function() {
$(this).removeClass("myStyle")
})
</script>
</body>
</html>
有问题请追问～
1.首先样式要设定好，在每个li区域只能显示a或者b。2.引入js库代码（jquery库需要引用，1.4版本以上都可以）
3.设定外部ul的id属性：假设为ullist
4.编写js代码
下面是我写的一个例子代码，供你参考，jquery库需要自己下载并引用
<ul id="ullist">
<li>
<div class="a">A面内容</div>
<div class="b">B面内容</div>
</li>
<li>
<div class="a">A面内容</div>
<div class="b">B面内容</div>
</li>
</ul>
<style type="text/css">
#ullist
{
overflow: hidden
}
#ullist li
{
height: 30px
width: 100px
overflow: hidden
line-height: 30px
}
#ullist .a
{
width: 30px
width: 100px
display: block
}
#ullist .b
{
width: 30px
width: 100px
display: none
}
</style>
<script type="text/javascript">
$(function () {
$('#ullist li').hover(
function () { $('.a', this).hide()$('.b', this).show()},
function () { $('.b', this).hide()$('.a', this).show()}
)
})
</script>
