js为一个元素绑定事件,那么这个元素就永远拥有这个事件吗

js为一个元素绑定事件,那么这个元素就永远拥有这个事件吗?
可能大家看到这个题目觉得怪怪的，我也是。因为我题目太短，不好表达意思。我i就用代码演示下。这个问题之前一直没注意过，还是在一个同学那边发现的，涨知识le。

<div>
  <li>li1</li>
  <li>li2</li>
  <li>li3</li>
</div>
<ul>

</ul>
<script>
 var li=document.querySelectorAll('div li');//获取div里面的li元素
  //遍历所有li,为他们绑定点击事件
  li.forEach(function (el){
      el.addEventListener('click',function (e){
         e.target.style.color='red';
          alert('我被点击了');
      })
  })
  var ul=document.querySelector('ul');
  ul.appendChild(li[2]); //把li[2]添加到ul里面
  var ulLi=document.querySelector('ul li');
  ulLi.οnclick=function (){
      alert('我是ul中的li');
  }

此时我们点击li[2],也就是li3。页面会先弹出“我被点击了”，然后又弹出“我是ul中的li”。
此时你或许会疑惑，我们点击的是ul中的li,应该触发第二个方法，怎么会触发div中的li的点击事件呢。
当时我也很疑惑，经过一个大佬的指点，才略懂一二。
我们为一个元素绑定事件，就像为一个对象定义一个私有属性一样，他会永远带着这个事件，只要达到条件就会触发事件。
当然如果我们不想触发这种效果，我们就可以使用事件解绑的方法取消我们不想要的效果，就像我们取消一些不想要的默认事件一样。