html如何点击子元素事件而不触发父元素的点击事件

html如何点击子元素事件而不触发父元素的点击事件

          web中经常会出现父元素有点击事件，子元素也有点击事件。

         如果子元素和父元素都有点击事件，会出现点击事件冒泡的情况。

      如何避免冒泡排序：

 

      实现代码：

     html:

<div class="title login" style="color: #fff;font-size: 14px" id="personalInfo">你好,
                <span style="color:#fff;font-size: 14px "  id="login_name_span">战无不胜</span>
                <span style="color:#fff;font-size: 14px;margin-left: 4px " id="UserLogout">[注销]</span>
            </div>

     js:

   UserLogout.οnclick=function (e) {

        e.stopPropagation();//阻止事件冒泡即可

    }