onmouseout 和 onmouseleave 有何区别?

比如:在一个<td>标签有一个<a>标签

1.由于<a>标签是<td>标签的子标签。所以根据事件冒泡的原理,<a>标签上的onMouseOut和onMouseOver事件会被传递到<td>标签上。

2.对于onMouseOut和onMouseOver事件,浏览器会把<a>和<td>看做两个不同的object。从而当鼠标在两者之间移动时,会激发这两个事件。

3.而且在浏览器中有一个很有意思的特性,带有连接的文字是空心的。就是说当鼠标点没有定位在文字曲线上时,浏览器认为它是定位在该文字下面的object上的。(比如说你的鼠标是定位在123的1和2之间,而不定位在1上或2上时,相当于定位在<td>上。)

4.而onMouseEnter和onMouseLeave事件就把<a>和<td>都看成是鼠标在一个对象(<td>)上了,

看下边的例子,把鼠标移到123上
  1. <table><tr> <td onMouseOut="alert('onMouseOut')" bgcolor="#9999FF"> ------------------------------------------<br> hhhhhhhhhhhh <a href="#">123</a> ggggggggggg<br> ------------------------------------------<br> </td></tr></table>用 onMouseLeave 
  2. <table><tr> <td onMouseLeave="alert('onMouseLeave')" bgcolor="#9999FF"> ------------------------------------------<br> hhhhhhhhhhhh <a href="#">123</a> ggggggggggg<br> ------------------------------------------<br> </td></tr></table>

你可能感兴趣的:(浏览器,object)