JavaScript 浏览器对象模型BOM使用介绍(3)

// 间歇调用使用window对象的setInterval()方法; // 它会按照指定的时间间隔重复执行代码,直至间歇调用被取消或页面被卸载; // 它接收的参数与setTimeout()相同; var pox = setInterval(function(){ alert('间隔调用'); },1000); clearInterval(pox); // 取消间歇调用; // 利用setInterval()设置一个5秒的定时器; var num = 0; // 设置起始秒; var max = 5; // 设置终止秒; setInterval(function(){ num++; // 递增num; if(num == max){ clearInterval(this); // 取消间隔调用,this表示方法本身;一直跟踪间隔调用的ID; alert('5秒后弹窗'); } },1000);

// 一般使用超时调用来模拟间隔调用是一种最佳模式; // 因为使用间隔调用需要根据情况来取消ID,并且可能造成同步的一些问题;后一个间歇调用可能会在前一个间歇调用结束之前启动; var num = 0; var max = 5; function box(){ num++; if(num == max){ alert('5秒后弹窗'); }else{ setTimeout(box,1000); // 隔1秒之后再次执行一个超时调用; } }; setTimeout(box,1000); // 执行定时器; // PS:在使用超时调用时,没必要跟踪超时调用ID,因为每次执行之后,如果不再设置另一个超时调用,调用就会自动停止;

二 location对象

location是BOM对象之一,它提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能;
事实上,location对象是window对象的属性,也是document对象的属性;
alert(location); // 获取当前的URL

(1).location对象的属性
属性 描述的URL内容
hash 如果该部分存在,表示锚点部分;
host 主机名:端口号;
hostname 主机名;
href 整个URL;
pathname 路径名;
port 端口号;
protocol 协议部分;
search 返回URL的查询字符串('?gws_rd=ssl#safe=strict&q=ab'),这个字符串以问号开头;
(2).location对象的方法
assign() 跳转到指定页面,与href等效;
reload() 重载当前URL;
replace() 用新的URL替换当前页面;

location.hash = '#1'; // 设置#后的字符串,并跳转;
location.hostname = 'Jack'; // 设置主机名;
location.search = '?id=5'; // 设置?后的字符串;

// 在Web开发中,我们经常需要获取诸如?id=5&search=ok这种类型的URL的键值对; // 通过location,我们可以写一个函数,来一一获取; function getArgs(){ // 创建一个存放键值对的数组; var args = []; // 去除?号; var qs = location.search.length>0?location.search.substring(1):''; // 按&字符串拆分数组; var items = qs.split('&'); var item = null, name = null, value = null; //遍历 for(var i = 0; i<items.length; i++){ item = items[i].split('='); name = decodeURIComponent(item[0]); // 因为查询字符串被浏览器编码过; value = decodeURIComponent(item[1]);// 每个查询字符串参数都变成了args对象的属性; // 把键值对存放到数组中; args[name] = value; } return args; } var args = getArgs(); alert(args['id']); // 获取URL中id对应的值;

JavaScript 浏览器对象模型BOM使用介绍

复制代码 代码如下:


location.assign('http://www.baidu.com');      // 跳转到指定的URL;2
location.reload();                            // 最有效的重新加载,有可能从缓存加载;
location.reload(true);                        // 强制加载,从服务器源头重新加载;5
locatioin.replace('http://www.baidu.com');    // 在本页跳转到百度页面,并且可以避免产生跳转的历史记录;

三 history对象

history对象是window对象的属性,它保存着用户上网的记录,从窗口被打开的那一刻算起;

(1).history对象的属性

length                 history对象中的记录数;
(2).history对象的方法
back()                前往浏览器历史条目前一个URL,类似后退;
forward()             前往浏览器历史条目下一个URL,类似前进;
go(num)               浏览器在history对象中向前或向后;

复制代码 代码如下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgjxzj.html