JS中改变CSS样式以及阻止冒泡总结_css阻止事件冒泡-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_44995829/article/details/128811611

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>DOM编程挑战</title>
    <link rel="stylesheet" type="text/css" href="style/DOM.css">
    <script type="text/javascript" src="js/DOM.js"></script>
</head>
<body>
    <div id="divselect">
          <cite>请选择分类</cite>
         <ul>
            <li id="li"><a href="javascript:;" selectid="1">ASP开发</a></li>
            <li><a href="javascript:;" selectid="2">.NET开发</a></li>
            <li><a href="javascript:;" selectid="3">PHP开发</a></li>
            <li><a href="javascript:;" selectid="4">Javascript开发</a></li>
            <li><a href="javascript:;" selectid="5">Java特效</a></li>
        </ul>
    </div>
</body>
</html>

window.onload=function(){
    var box=document.getElementById('divselect'),
        title=box.getElementsByTagName('cite')[0],
        menu=box.getElementsByTagName('ul')[0],
        as=box.getElementsByTagName('a'),
            index=-1;
   
    // 点击三角时
  title.onclick=function(event){
      event=event||window.event;
      if (event&&event.stopPropagation) {
        event.stopPropagation();
      }else{
        window.event.cancelBubble=true;
      }
      menu.style.display="block";
      // 执行脚本
    }