例题：在列表<ul>元素中，鼠标在列表项<li>元素移动时，可以自定义其获取焦点(focus)时的背景颜色，即设置表项<li>元素选中时的背景色.
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="https://www.imooc.com/data/jquery-1.8.2.min.js" type="text/javascript"></script>
</head>
<body>
<ul id = ul>
<li>苹果</li>
<li>葡萄</li>
<li>火龙果</li>
<li>哈密瓜</li>
<li>西瓜</li>
</ul>
<script type="text/javascript">
(function ($) {
$.extend({
"FocusColor": function (li_col) {
$(this).find('li').each(function(i,e){
$(e).mouseover(function(){
$(e).css('background-color',li_col);
}).mouseout(function(){
$(e).css('background-color','#fff');
})
})
return $(e);
}
});
})(jQuery);
$(function () {
$.FocusColor('red');
});
</script>
</body>
</html>
结果：
