1.事件冒泡

1.1原理

当前元素的事件会向上(向父级)进行传递,当父级有同名事件时会自动触发

1.2 事件冒泡

根据冒泡原理,当前元素上的同名事件,会向上传递到它的父级,如果当前是一个列表,或者当前是一组集合,那么添加事件会非常麻烦,不管当前有多少个元素,根据DOM树的特点,都会有一个父级,所以,可以将这个事件, 直接添加到它的父级上即可, 可以极大的简化代码,但是要通过一些手段, 来判断当前是哪个子元素触发了事件
事件委托/事件代理: 将子元素的事件,委托在父元素上触发,以简化代码

如图 点击父盒子 子盒子也会触发
<body>
   <div class="box" style="width:400px;height:400px; background-color:seagreen">
   <div class="box1" style="width:200px;height:200px; background-color:sandybrown"></div></div>
</body>
<script>
   document.querySelector('.box').addEventListener('click',()=>{
      alert('666')
      // 事件绑定者：event.currentTarget
   console.log(event.currentTarget)
   // 事件触发者：event.target
   console.log(event.target);
   })
</script>

2. 字符串api

 let a='AbCdeF'
//  1.大小写转换
// 小写
console.log(a.toLocaleLowerCase());
// 大写
console.log(a.toUpperCase());
// 2.分隔字符串
console.log(a.split(''));
// 3.将字符串变api
document.write(`${a.link('https:baidu.com')}`)
// 4.字符串加粗
document.write(`${a.bold()}`)
// 5.去除字符串的两边的空格，会将去除空格之后的结果返回给我们。
let b=' 123   '
console.log(b.trim());

事件冒泡，字符串api

1.事件冒泡

1.1原理

1.2 事件冒泡

2. 字符串api

相关文章