BOM之浏览器常见事件

事件的定义:所谓的事件,就类似于一个约定,当触发条件时,就会执行指定的程序
1.click点击事件
给标签绑定点击事件 当标签触发 点击条件时 执行绑定的程序
click 点击事件 — 事件类型
onclick 绑定点击事件 , 给标签绑定一个事件类型
事件处理函数 , 触发事件时,执行的程序
也可以是一个已经定义好的函数
给div标签,绑定了一个事件类型
事件类型是点击事件类型
点div标签被点击时,触发执行程序

d1.onclick = function(){ 
     console.log('我是div,有人点我');
}

需要绑定已经定义的函数
必须绑定函数名称,或者变量名称
绝对绝对绝对,不能有()
这里绑定的是,函数名称,变量名称中存储的, 函数的地址
如果有 () , d2.onclick = fun()是将 fun() 的执行结果, 绑定给事件
给点击事件,绑定一个fun函数名称中,存储的函数地址,触发事件时,调用地址,找到对应的函数,执行函数程序
2.load 事件 window.onload = function(){}
页面加载事件
当页面程序都加载结束之后,执行的程序
如果JavaScript程序定义在其他程序(html,css)之前,
绑定 load 事件 , 让程序在 页面加载完毕之后,再执行
不推荐使用这种方法
一般是将script标签,写在程序的最下方
外部导入js文件,要么放在head中
要么也放在body的最下方
3.open 事件 window.open(‘url地址’)
定义打开的页面 — 新窗口打开页面
window.location.href = ‘url地址’ 当前窗口打开页面

        loc.onclick = function(){
            window.location.href = 'https:/www.baidu.com';
        }

        ope.onclick = function(){
            window.open('https:/www.baidu.com') ;
        }
        

4.scroll 事件 window.onscroll = function(){}
滚动条事件
当浏览器 滚动条 位置发生改变时,触发事件

        window.onscroll = function(){
            console.log('我滚了');
        }

5.resize 事件 window.onresize = function(){}
当页面大小发生改变时,触发事件

        window.onresize = function(){
            console.log('我改了');
        }

6.close 事件 window.close()
关闭当前页面事件

        c.onclick = function(){
            window.close();
        }
发布了27 篇原创文章 · 获赞 3 · 访问量 474

猜你喜欢

转载自blog.csdn.net/qq_44531034/article/details/105130170
今日推荐