js bom

Bom笔记

Window6个官方定制的对象属性:

Window.document; //html文档输出的是HTML里的所有内容

Window.frames;//框架包括window的所有属性

Window.location;//地址栏,网页中顶部显示网址的地方

Window.history;//历史记录

Window.location.href//直接输出地址栏内的网址href是相对路径

Window.navigator;//浏览器的厂商信息

Window.screen;//用户设备的屏幕分辨率

Window.location.reload();不带参数带缓存的刷新;

Window.location.reload(true);//不带缓存的刷新,如果值为false则为带缓存的刷新

通过window.location来实现跳转。

扫描二维码关注公众号,回复: 3494645 查看本文章

function jump(){

// 通过修改location.href的属性值来进行页面跳转是会增加记录的。

window.location.href = "5.history2.html";

}

返回记录

function goBack(){

//回到记录中的上一条

window.history.back();

}

function goNext(){

//回到记录中的下一条

window.history.forward();

}

function goNum(){

//跳转到指定的记录

window.history.go(-1);

}

判断浏览器类型:

if(window.navigator.userAgent.indexOf("AppleWebKit")!=-1){

alert("谷歌浏览器");

}

if (window.navigator.userAgent.indexOf("Gecko")!=-1) {

alert("火狐");

}

if (window.navigator.userAgent.indexOf("Trident")!=-1) {

alert("IE");

}

Bom常用的方法:

function openNewWindow(){//打开一个新的窗口

// window.open(url,"","描述新窗口特性的字符串")

window.open("5.history.html","","width=500px,height=500px,left=300px,top=0px");

}

function closeWindow(){

//关闭当前窗口

window.close();

}

window.onload = function(){//加载事件,总是在最后之执行

alert("页面加载完成!");

}

获取滚动条到浏览器顶部的高:

window.onscroll = function(){

console.log("");

var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;

console.log( scrollTop );

}

回到顶部:

function goTop(){

document.documentElement.scrollTop = 0;

document.body.scrollTop = 0;

}

Resize

//缩放的时候 resize onresize

window.onresize = function(){

console.log("我要变了");

//获取可视窗口的宽

console.log( document.documentElement.clientWidth );

console.log( document.body.clientWidth );

console.log( window.innerWidth );

//var w

= document.documentElement.clientWidth||document.body.clientWidth||window.innerWidth;

//获取可视窗口的高度

console.log( document.documentElement.clientHeight );

console.log( document.body.clientHeight );

console.log( window.innerHeight );

//var h

=document.documentElement.clientHeight||document.body.clientHeight||window.innerHeight;

}

定时器:

//定时器

// 间歇定时器:每隔固定的时间调用一次。

// setInterval()

// 功能:创建一个间歇定时器

// 参数:参数1 函数名或者匿名函数  参数2时间

// 返回值:定时器的id. 可以根据该id停止定时器

// var timer = setInterval(函数名/匿名函数,时间(毫秒))

//clearInterval(id)

// 停止指定的定时器

var timer = setInterval(fun,2000);

function fun(){

console.log("犯病!");

}

function stop(){

clearInterval( timer );

}

function goon(){

//将返回的定时器的id赋值给timer这个全局变量

timer = setInterval(fun,2000);

}

//js中只有创建定时器,停止定时器。没有继续定时器。

// 延时定时器:过固定的时间执行。(类似定时炸弹)

//setTimeout(函数名/匿名函数,时间)

// 功能:创建一个延时定时器。

// 参数:参数1 函数名或者匿名函数  参数2时间

// 返回值:定时器的id. 可以根据该id停止定时器

//clearTimout(id)

// 功能:停止延迟定时器

var timer2 = setTimeout(fun2,5000);

function fun2(){

console.log("爆炸!");

}

function stopBoom(){

clearTimeout( timer2 );

}

猜你喜欢

转载自www.cnblogs.com/shangXR/p/9760414.html