BOM对象

浏览器对象模型的英文缩写。操作浏览器窗口

一、window对象:我们打开一个页面时的窗口

1.全局变量,局部变量

全局变量不属于任何一个函数,作用域在整个文档

局部变量在函数内部定义的变量,这种变量的作用域(有效范围)仅仅在该函数中

2.获取浏览器主窗口距离屏幕左侧和顶部的间隔

获取到的值是是以像素为单位的数值

window.screenLeft

window.screenTop

在火狐下使用window.screenX/screenY获取间隔

3.获取浏览器宽度:获取到的是显示用户页面的窗口宽高,如果调出了控制台或工具栏,则宽高不包含这些元素

console.log(window.innerWidth);

console.log(window.innerHeight);

4.window.open('http://www.baidu.com','hello','height=200,width=200,left=100,top=0,location=1')

window.open(参数1,参数2,参数3)

参数1:要打开页面的url字符串,地址

参数2:在指定的窗口打开该页面,若没有该窗口,则自动新建一个改名字为这个的窗口。该参数值也可以是

_self,_parent,_top,_blank之一

参数3:该参数是一个用逗号分隔的设置字符串,如果第二个参数中指定的窗口或框架不存在,则使用参数三中的设置,打开一个新窗口{

属性:height\width窗口文档显示区域的宽高

left\top窗口的坐标,不能负数

toolbar=yes||no是否显示浏览器的工具栏

scrollbars=yes||no是否显示滚动条

location=Yes||no是否显示地址

status=Yes||no是否添加状态栏

menubar=yes||no是否显示菜单栏

resizable=yes||no窗口是否可调节

titlebar=yes||no是否显示标题栏

}

5.定时器:setInterval

clearInterval

有函数名的函数是:具名函数

function hello(){

console.log('hello');

}

没有函数名的函数是匿名函数

function (){

console.log('hello');

}

使用for循环可以让某段代码重复执行,但是无法控制执行的时间

如果需要让某段代码每个若干秒执行一次,可以使用定时器完成

setInterval(参数一,参数二)

参数一是一个匿名函数,或外部函数的函数名,放在参数一上的代码会循环执行

参数二是一个以毫秒为单位的时间数值,指定每隔多少时间执行一次参数一里的代码

window.setInterval(function(){

console.log('hello');

},2000);

6.window.onload事件

当页面渲染完毕后,触发window的onload事件,执行该事件的函数

window.onload=function(){

标签修改在页面渲染完毕后进行

工具函数:产生六位数的随机函数

function randomFun(min,max){

return parseInt(Math.random()*(max-min)+min)

}

}

获取页面中的p标签,通过定时器不断获取新验证码,并把验证码写进标签中

var pElement=document.getElementById('p的id');

var timer=setInterval(function(){

获取验证码

var code = randomFun(100000,1000000);

把验证码写入p标签中

pElement.innerHTML=code

},20);

7.u盾循环

获取按钮标签,给标签添加点击事件,触发的函数是清楚定时器

var btn = document.getElementById('btn');

给按钮添加一个点击事件,点击按钮后,事件所绑定的函数被触发

btn.onclick=function(){

clearInterval(timer);

}

var timer;

获取到开始按钮,并添加事件

var star=document.getElementById('按钮id');

timer = setInterval(function(){

clearInterval(timer);

var code=randomFun(100000,1000000);

star.innerHTML=code

},100);

8.延时定时器:setTimeout

让函数延迟若干毫秒执行,只执行一次

var timer = setTimeout(function(){

alert('hello')

},2000);

延时定时器参数和循环定时参数一样。当代码执行到延时计时器时,会开启一个时钟,代码会跳过延时函数继续向后执行,当时钟达到设定的时间后,再回来触发该函数

每开启一个延时定时器,会返回该定时器的id,通过这个id就可以获取到这个定时器

清理延时定时器:通过id获取到要清理的定时器

clearTimeout(timer);

9.confirm()弹框会给用户提供两个选择:确定和取消,用户点击确定,返回true,否则返回false

用户点击了取消按钮和关闭按钮都会返回false

var bol = confirm('hello world');

if(bol){

alert('queding')

}else{

alert('quxiao')

}

var str = prompt('')

判断用户在输入框中输入值

if(str!=null&&str.length!=0){

alert('')

}else{

alert('')

}

10. console.log(location.hash);

console.log(location.host);

console.log(location.hostname);

console.log(location.toString());

console.log(location.pathname);

console.log(location.port);

console.log(location.search);

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容