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】