函数与事件


function fn(){
console.log(“我是 fn 函数”)
}

fn()
手动调用
函数名字() 就是 立即调用

 btn.onclick = fn()  // 错的  不要记了

fn()立即调用 然后把这个函数调用完毕的结果 赋值给 btn.onclick
btn.onclick = undefined
btn.onclick = fn
函数的名字 => 函数空间的地址
点击事件发生的时候 就通过 这个地址 去找到 那一个 函数 空间 然后 把 里面的代码 拿出来执行
btn.onclick = function(){
// 事件处理函数
fn()
}
函数的优点
1、封装 把一段功能代码放到一个空间
2、即时 想什么时候用就什么时候用
3、复用 可以多次调用

常见的事件

浏览器事件
onload 页面资源加载完毕事件
onscroll 页面滚动 事件
鼠标事件
onclick
dblclick 双击
onmousedown 鼠标按下
onmouseup 鼠标抬起
onmousemove 鼠标移动
键盘事件
onkeydown 键盘按下
onkeyup 键盘抬起
表单事件
onfocus 获取焦点
onblur 失去焦点
oninput 输入事件
onchange 表单失去焦点的时候 里面的内容发生改变才会触发
onsubmit 提交事件
移动端事件
ontouchstart 触摸到屏幕
ontouchmove 移动
ontouchend 离开屏幕

调用练习

	    inp.oninput = function(){
            console.log("输入事件")
        }
        inp.onchange = function(){
            console.log("表单改变事件")
        }
        inp.onfocus = function(){
            console.log("获取焦点了")
        }
        inp.onblur = function(){
            console.log("失去焦点了")
        }

        console.log(box)
        window.onscroll = function(){
            console.log("滚吧")
        }

        box.onmousedown = function(){
            console.log("鼠标按下了")
        }
        box.onmouseup = function(){
            console.log("鼠标抬起了")
        }
        box.onmousemove = function(){
            console.log("鼠标在动")
        }
©️2020 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页