题解 | #事件委托#

事件委托

https://www.nowcoder.com/practice/02866b3ce7f8420c8b5d22f483c5fcc0

Make sure you really understand the outcme of the html, "when you click the list item, one dot will become two dots, not the space between marker and dots will become smaller". so the logic will find the clicked item, then change the innerHTML to two dots

<script type="text/javascript">
      /* 2.event logic gose here
        2.1 test the binding
        
        2.2 when you click the item, two dots gather together:one dots is from ul, other one is from html
        2.3 get the clicked list item, then appedn the effect
        2.3 append the css to the dom element

        
        */

      function getEventTarget(e) {
        e = e || window.event;
        return e.target || e.srcElement;
      }
      var ul = document.getElementById("test");

      ul.onclick = function (event) {
        // change the space between the marker and content
        // How do you add CSS with Javascript?
        // https://stackoverflow.com/questions/707565/how-do-you-add-css-with-javascript
        // How to add a class to a given element?
        // https://stackoverflow.com/questions/507138/how-to-add-a-class-to-a-given-element
        // Reducing the gap between a bullet and text in a list item
        // https://stackoverflow.com/questions/2441059/reducing-the-gap-between-a-bullet-and-text-in-a-list-item
        // CSS: Control space between bullet and <li>
          // https://stackoverflow.com/questions/4373046/css-control-space-between-bullet-and-li

        // var styles = `
        // li{
        //   text-indent: -10px;
        // }
        // `;
        // var styleSheet = document.createElement("style");
        // styleSheet.innerText = styles;
        // document.head.appendChild(styleSheet);
        let target = getEventTarget(event);
        // var element = target.getElementsByTagName("li")
        // console.log(element)
        // var target2 = element.classList.add("my-class")
        //  console.log(target2)
        target.innerHTML = ".."
      //  alert( target.innerHTML);
      };
      // code from: http://jsfiddle.net/ArondeParon/2dEFg/5/

    </script>

全部评论

相关推荐

07-03 11:02
中山大学 C++
字节刚oc,但距离九月秋招很近了有两段互联网实习,非腾讯字节。不敢赌转正,现在在纠结去还是不去如果实习俩月离职会有什么后果吗
阿城我会做到的:不去后悔一辈子,能否转正取决于ld的态度,只要他不卡,答辩就是走流程,个人觉得可以冲一把
投递字节跳动等公司8个岗位
点赞 评论 收藏
分享
就前几天旅游的时候,打开抖音就经常刷到这类视频:以前是高学历学生、老师、主持人,现在做着团播、擦边主播的工作,以及那些经过精心包装的“职业转型”故事——从铺天盖地的VLOG到所谓的“04年夜场工作日记”,这些内容在初中升学、高考放榜等关键时间节点持续发酵。可以说非常直接且精准地在潜移默化地影响着心智尚未成熟的青少年,使其对特殊行业逐渐脱敏。那我就想问了:某些传播公司、平台运营者甚至某些夜场的老板,你们究竟在传递怎样的价值观?点开那些视频,评论区里也是呈现明显的两极分化:一种是​​经济下行论​​:“现在就业市场已经艰难到这种程度了吗?”​​一种是事实反驳派​​:这些创作者往往拥有名校背景,从事着...
牛客刘北:被环境教育的,为了能拿到足够的钱养活自己,不甘心也得甘心,现在的短视频传播的思想的确很扭曲,但是很明显,互联网玩上一年你就能全款提A6,但你全心全意不吃不喝工作一年未必能提A6,但是在高考中考出现这个的确很扭曲,在向大家传播“不上学,玩互联网也可以轻松年入百万”,不是人变了,是社会在变
预测一下26届秋招形势
点赞 评论 收藏
分享
06-07 17:17
嘉兴学院 教师
心爱的idea:你孩
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务