加载事件
/*
* 浏览器中有个顶级对象:window
* 页面中顶级对象:document
* top是window的另一种表示方法
* 页面中的所有内容都是浏览器的----->页面中的所有内容都是window
* 页面加载事件:
* 只有这个页面加载完毕，这个事件才会触发(页面中的所有内容，包括文本，属性，标签以及外部引入文件)
* window.οnlοad=function();----->window可以省略
* */<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
window.onload = function () {
document.getElementById("btn").onclick = function () {
console.log("可是谁又真的关心谁");
};
};
//扩展的事件---页面关闭后才触发的事件
window.onunload = function () {
alert("哈哈");
};
//扩展事件---页面关闭之前触发的
window.onbeforeunload = function () {
alert("哈哈");
};
</script>
<input type="button" value="按钮" id="btn">
</body>
</html>window下对象的说明
/*
* window.location-----地址栏里面的内容
* window.location.hash-----地址栏上#以及后面的内容
* window.location.host----主机以及端口号
* window.location.hostname----主机名
* window.location.pathname----文件路径----相对路径
* window.location.port----端口号
* window.location.protocol----协议
* window.location.search----搜索的内容
* window.location.href="地址";-----地址的跳转
* window.history.forward();----网页前进
* window.history.back();----网页后退
* window.location.assign("地址");----地址的跳转
* window.location.reload();----重新加载(刷新)
* window.location.replace("地址");----没有历史记录，不能返回
* window.navigator.userAgent----通过userAgent可以判断用户浏览器的类型
* window.navigator.platform----通过platform可以判断浏览器所在的系统平台类型
* */<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
//location对象中的属性和方法
console.log(window.location);
//地址栏上#及后面的内容
console.log(window.location.hash);
//主机名及端口号
console.log(window.location.host);
//主机名
console.log(window.location.hostname);
//文件的路径---相对路径
console.log(window.location.pathname);
//端口号
console.log(window.location.port);
//协议
console.log(window.location.protocol);
//搜索的内容
console.log(window.location.search);
//通过platform可以判断浏览器所在的系统平台类型
console.log(window.navigator.platform);
//通过userAgent可以判断用户浏览器的类型
console.log(window.navigator.userAgent);
onload=function () {
document.getElementById("btn").onclick=function () {
//设置跳转的页面的地址
location.href="http://www.jd.com";//属性----------------->必须记住
//location.assign("http://www.jd.com");//方法
// location.reload();//重新加载--刷新
// location.replace("http://www.jd.com");//没有历史记录
};
};
</script>
<input type="button" value="显示效果" id="btn"/>
</body>
</html>
