jquery好玩的东西

搞后台弹出层，用jquery，实现的效果，发现 一个好玩的东西：

<script language="javascript">
var x = 10;
var y = 20;
$(function (){
$(".divpop").mouseover(function(e){
		var keywords=$(this).attr('foc');
		$(this).parent().css('background','#94D0EE');
		var  tooltip="<div id='tooltip'>关键字:"+keywords+"<\/div>"; //创建 div 元素
		$("body").append(tooltip);	//把它追加到文档中
		$("#tooltip")
			.css({
				"top": (e.pageY+y) + "px",
				"left":  (e.pageX+x)  + "px"
			}).show("fast");	  //设置x坐标和y坐标，并且显示
}).mouseout(function(){
		$(this).parent().css('background','#fff');
		$("#tooltip").remove();	 //移除 
    }).mousemove(function(e){
		$("#tooltip")
			.css({
				"top": (e.pageY+y) + "px",
				"left":  (e.pageX+x)  + "px"
			});
	});
	$(".divpop").siblings("td").mouseover(function(){
		$(this).parent().css('background','#94D0EE');
	}).mouseout(function(){
		$(this).parent().css('background','#fff');
	})
});
</script>

 $(".divpop").siblings("td").mouseover(function(){
$(this).parent().css('background','#94D0EE');
}).mouseout(function(){
$(this).parent().css('background','#fff');
})
$(this)代表鼠标移上去或者移出去的那个td，可以得出结论，可以通过元素事件，就不用直接遍历元素了

本来也可以这样：

 $(".divpop").siblings("td").each(function(){
  $(this).mouseover(function(){$(this).parent().css('background','#94D0EE')}).mouseout(function(){
  $(this).parent().css('background','#fff');
 })
 })

 

效果如下：