浏览器对象模型的英文缩写。操作浏览器窗口
一、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);