JS中BOM的加载事件

BOM--->Browser Object Model 浏览器对象模型,操作浏览器的。

浏览器中有个顶级对象:window
页面中顶级对象:document
页面中所有的内容都是属于浏览器的,页面中的内容也都是window的,变量是window的
要使用变量或者方法时候,window可以省略
因为页面中的所有内容都是window的,window是可以省略的.

加载事件

window.onload---只要页面加载完毕,这个事件就会触发

window.onunload--页面关闭后才触发的事件

window.onbeforeunload--页面关闭之前触发的

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    // document.getElementById("btn").onclick=function () {
    //     alert("哈哈,你好");//会报错
    // }
    //只要页面加载完毕,这个事件就会触发-----页面中所有的内容,标签,属性,文本,包括外部引入js文件
    window.onload=function () {
        document.getElementById("btn").onclick=function () {
            alert("你好啊");
        };
    };
    //页面关闭后才触发的事件
    //    window.onunload=function () {
    //
    //    };
    //页面关闭之前触发的事件
    //    window.onbeforeunload=function () {
    //      alert("哈哈");
    //    };
</script>
<input type="button" id="btn" value="按钮" />
</body>
</html>

原文地址:https://www.cnblogs.com/hzdwwzz/p/10332084.html

时间: 2024-11-08 23:50:23

JS中BOM的加载事件的相关文章

js中全局变量修改后的值不生效【jsp页面中各个js中内容的加载顺序】

一个老项目中,一个jsp文件中有很多个js文件, 现在要在页面上的一个地方判断一个状态,因为一直找不到原来是在哪里修改的那个状态,所以决定不找了,而是在比较靠前引入的一个js中定义一个全局变量,然后在这个js的 $(function(){}} 方法中通过一个ajax向后台获取正确的状态,然后在所有的js都加载完之后根据全局变量的值的状态来修改页面上的逻辑. 但是发现,全局变量被一个外部js修改赋值后,我在jsp页面的最下面居然取不到修改过的值. 请教同事才发现原来原因是 任何一个js文件中的 $

293 Node.js中模块的加载机制

原文地址:https://www.cnblogs.com/jianjie/p/12330578.html

js 动态加载事件的几种方法总结

本篇文章主要是对js 动态加载事件的几种方法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 有些时候需要动态加载javascript事件的一些方法往往我们需要在 JS 中动态添加事件,这就涉及到浏览器兼容性问题了,以下谈及的几种方法,我们也常常混合使用. 方法一.setAttributevar obj = document.getElementById("obj");obj.setAttribute("onclick", "javasc

[JS前端开发] js/jquery控制页面动态加载数据 滑动滚动条自动加载事件

页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空间,到底部时,会动态加载剩余的说说或者是日志 今天我们就来看看他们的实现思路和js控制动态加载的代码 下面的代码主要是控制滚动条下拉时的加载事件的 在下面代码说明出,写上你的操作即可,无论是加载图片还是加载记录数据  都可以 别忘了引用jquery类库 [JavaScript] 纯文本查看 复制代码

Eclipse中使用Tomcat加载项目在浏览器中访问的时候JS和CSS等静态文件无法加载的问题

首先,我的Eclipse是引用外部的Tomcat 引用外部Tomcat会在左侧生成一个Server文件夹,相当于复制了一份Tomcat到Eclipse的安装目录里 具体Tomcat所在目录可以在这进行查看 双击Tomcat服务,会打开一个窗口,然后点击Open launch configuration,可打开配置窗口,在这里可以查看到具体服务所在位置. 接下来步入正题,正如题目所说,Eclipse中使用Tomcat加载项目在浏览器中访问的时候JS和CSS等静态文件无法加载,如图 仔细看下路径,会

JS实现图片预加载无需等待

网站开发时经常需要在某个页面需要实现对大量图片的浏览;用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考虑流量的话,大可以像pconline一样每个页面只显示一张图片,让用户每看一张图片就需要重新下载一下整个页面.不过,在web2.0时代,更多人愿意用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片. 知道了一张图片的地址,需要把它在一个固定大小的html容器(可以是

bootstrap中的动态加载出来的图片轮播中的li标签中的class=&quot;active&quot;的动态添加移除

//该方法是在slide改变时立即触发该事件, $('#myCarousel').on('slide.bs.carousel', function () { $("#myCarousel ol li").toggleClass("active");//重复切换类名“active” }); 遇到的问题:在动态加载出来的轮播中设置了加载时就开始轮播data-ride="carousel"图片可以轮播但是底下的li标签的class没有进行切换.而不加d

小白学phoneGap《构建跨平台APP:phoneGap移动应用实战》连载四(使用程序加载事件)

在了解了PhoneGap中都有哪些事件之后,本节将开始对这些事件的用法进行详细地介绍.本节要介绍的是程序加载事件,也就是deviceready.pause和resume这3个事件. [范例4-2 程序加载事件的使用] 01 <!DOCTYPE html> 02 <html> 03 <head> 04 <meta charset="utf-8"> 05 <title>程序加载事件的使用</title> 06 <

Sea.js 是一个模块加载器

1 模块定义define define(function(require,exports,module){ //require 引入需要的模块如jquery等 //var $ = require('./jquery'); //exports可以把方法或属性暴露给外部 exports.name = 'hi'; exports.hi = function(){ alert('hello'); } //module提供了模块信息 }); 2 使用定义好的模块seajs.use <!doctype ht