js浏览器对象模型【BOM】(十三)

一、时间定时器
1、超时调用
setTimeout(fun,time) 【返回一个唯一标识该超时调用的ID数值】
参数：
fun:要执行的函数
time:设置第多少毫秒后执行fun函数

clearTimeout(ID) 取消超时调用定时器【通过定时器返回的唯一标识ID值取消定时器】
eg：

    var id = setTimeout(function(){

        console.log('hello');

    },10000);    //设置第10秒后输出hello

    console.log('--------------');

    setTimeout(function(){

        //5秒后终止setTimeout

        console.log('5000毫秒');

        //清除超时调用

        clearTimeout(id);    //第5秒后输出5000毫秒并清除id定时器

    },5000);

2、间歇调用
setInterval(fun,time) 【返回一个唯一标识该超时调用的ID数值】
按照指定的时间间隔重复执行fun函数代码，直到间歇调用被取消或页面被卸载
参数：
fun:要执行的函数
time:设置每个多少毫秒时间执行fun函数

clearInterval(ID) 　取消间歇调用【通过定时器返回的唯一标识ID值取消定时器】
eg：

    //每隔一秒后输出1

    var sid = setInterval(function(){

        console.log(1);

    },1000);

    //在第10秒后清除间歇调用

    setTimeout(function(){

        clearInterval(sid); //第10秒后取消sid定时器,sid只执行了9次,在第10秒后就被取消了

    },10000);

二、系统对话框【调用对话框显示时会停止执行代码,关闭后在继续执行，如需在弹出框中显示换行，使用转义字符\n】
1、alert(要显示的警告信息) 　　【警告对话框】
显示包含指定的文本和一个"OK"按钮

2、confirm(要显示的确认信息) 　　【确认对话框】【返回布尔类型】
显示包含指定的文本和一个"OK"按钮以及"Cancel"按钮

该方法返回布尔值：
a、单击了OK返回true
b、单击cancel或者关闭按钮返回false

3、prompt(要显示提示信息,[文本输入域显示的默认值]) 　　【提示会话框】【返回输入域的值或null】
显示包含文本，ok按钮,cancel按钮以及一个文本输入域，以供用户在其中输入内容;第二个参数可以不写

该方法返回值：
a、单击OK按钮，该方法返回输入域的值
b、单击了Cancel或者关闭对话框该方法返回null

三、window对象
1、window对象的一些相关属性：
innerWidth　　浏览器窗口的内宽度（以像素计）
innerHeight　　浏览器窗口的内高度（以像素计）

2、window对象的一些相关方法：
open(url)　　打开新窗口【在新选项卡中打开url页面】
close()　　关闭当前窗口【大多数浏览器只允许脚本自动关闭由脚本创建的窗口】
moveTo(x,y)　　移动当前窗口【可把窗口的左上角移动到一个指定的坐标】
resizeTo(width,height)　　重新调整当前窗口【可把窗口的左上角移动到一个指定的坐标】
stop()　　停止页面载入

四、location对象【既是window对象也是document对象】
提供与当前窗口中加载的文档有关的信息，还提供一些导航功能。
eg：

    console.log(window.location == document.location);　　//true

1、location对象的一些相关属性：
host　　返回带端口号的服务器名称
hostname　　返回不带端口号的服务器名称
href　　返回当前加载页面的完整URL
pathname　　返回URL的目录和文件名
port　　返回URL中指定的端口号
protocol　　返回页面使用协议
search　　返回URL的查询字符串【url地址后面携带的一些参数部分】，这个字符串以问号开头

2、location对象的一些相关方法：
assign(url) 【可返回上一个浏览页面】
打开新url，并会历史记录中添加一条记录
eg：

    //三者作用效果一样

    window.location="https://www.cnblogs.com/nzcblogs/";

    location.href="https://www.cnblogs.com/nzcblogs/"

    location.assign("https://www.cnblogs.com/nzcblogs/");

replace(url) 【不可返回上一个浏览页面】
重新定位到url路径的页面上，不会在历史记录中添加新记录【类似重定向】

reload(boolean) 【重新加载当前显示的页面】
参数为布尔值：
false，表示以最有效方式重新加载，可能从缓存中直接加载【默认值为false】
true，表示强制从服务器中重新加载【相当于使用了location、location.href、location.assign(url)重新打开url路径页面】

window.open(url) 在新选项卡中打开url页面

五、history对象
1、history对象的一些相关属性：
length　　返回历史列表中的网址数
注意：IE和Opera从0开始，而Firefox、Chrome和Safari从1开始。

2、history对象的一些相关方法：
back()
加载历史列表中上一个 URL，这等同于在浏览器中点击后退按钮(向左的箭头)。

forward()
加载 history 列表中的下一个 URL，这等同于在浏览器中点击前进按钮(向右的箭头)

go(number)
加载 history 列表中的某个具体页面
参数为number类型：
正数表示向前跳转【number为1时，类似于forward()方法，加载下一个URL】
负数表示向后跳转【number为-1时，类似于back()方法，加载上一个URL】

巴特西

js浏览器对象模型【BOM】(十三)

最新文章

热门文章