js表单事件

ondblclick： 鼠标双击元素，元素显示内容

<h1 style="background-color: bisque;">点我一下</h1>
    <script>
        let h1 = document.querySelector('h1');
         h1.ondblclick = function(){
         alert('我双击了')
       }

onmousemov： 鼠标在指定的区域内移动事件

<h1 style="background-color: bisque;">点我一下</h1>
h1.onmousemove = function (){
            console.log('我移动了');
         }

onfocus 获取焦点

user.onfocus = function (){
            user.style.color = 'red'
        }

onblur 元素失去焦点

/* blurFn是一个方法 */
 function blurFn(){
            user.style.color = ''
        }

onchange 用户改变域的内容

 function changeFn (){
            alert(car.value)
            // alert(car.childNodes[1].innerHTML)
            /* value值是后台所需要的值 如果想传给后台 请把value属性上 写上你需要传的值 */
        }

onreset 表单重置事件不支持input标签，支持form标签

resetId.onreset = function (){
             console.log('重置')
         }

onsubmit 表单提交事件不支持input标签，支持form标签

formId.onsubmit = function (){
            alert('我提交了')
        }

冒泡和捕获

点击子元素 把父元素的事件也调用了 事件冒泡

<div class="div1">
        <div class="div2"></div>
    </div>
    <script>
        let div1 = document.querySelector('.div1')
        let div2 = document.querySelector('.div2')
        div1.onclick = function(){
            alert(1)
        }
         div2.onclick = function(){
            alert(2)
        }

阻止事件冒泡的方法

<div class="div1">
        <div class="div2"></div>
    </div>
    <script>
        let div1 = document.querySelector('.div1')
        let div2 = document.querySelector('.div2')
        div1.onclick = function(){
            alert(1)
        }
         div2.onclick = function(){
            alert(2)
             e.stopPropagation();
        }

事件监听

和onclick的区别 区别一 写的方法不会被覆盖 / / 区别二 false表示冒泡（从里到外触发事件） / / true表示捕获 （从外到里触发事件）

 window.addEventListener('click',function(){
          alert(1)
         })
         window.addEventListener('click',function(){
             alert(2)
       })
        window.addEventListener('click',function(){
            alert(3)
        })