javascript事件冒泡简单示例

本文实例讲述了javascript事件冒泡的定义与用法。分享给大家供大家参考，具体如下：

 
  
  
  
  
   div * {
    display: block;
    margin: 4px;
    padding: 4px;
    border: 1px solid white;
   }
   textarea {
    width: 20em;
    height: 2em;
   }
  
  
 
 
  Bubble in Javascript DOM
  

   DOM树的结构是：
  
  
UL
 - LI
  - A
 - SPAN

  
   

    

     Bubbllllllllllllllle
    
    

     Bubbllllllllllllllle
    
   
  
    
  

   鼠标进入UL的任何一个子元素，如果不停止冒泡，我们从UL到SPAN都定义了鼠标悬停（
   
    mouseover
   ）事件，这个事件会上升了UL，从而从鼠标所进入的元素到UL元素都会有红色的边。
  
  
   

    

     Bubbllllllllllllllle
    
    

     Bubbllllllllllllllle
    
   
  
  

   如果停止冒泡，事件不会上升，我们就可以获取精确的鼠标进入元素。
  
 

更多关于Javascript相关内容感兴趣的读者可查看本站专题：《Javascript切换特效与技巧总结》、《Javascript查找算法技巧总结》、《Javascript动画特效与技巧汇总》、《Javascript错误与调试技巧总结》、《Javascript数据结构与算法技巧总结》、《Javascript遍历算法与技巧总结》及《Javascript数学运算用法总结》

希望本文所述对大家Javascript程序设计有所帮助。