首页 > 代码库 > JavaScript系列四:浏览器对象
JavaScript系列四:浏览器对象
1、window对象
Window对象是BOM的核心,window对象指当前浏览器窗口。
alert()显示带有一段消息和一个确认按钮的警告框
prompt()显示可提示用户输入的对话框
confirm()显示带有一段消息以及确认按钮和取消按钮的对话框
open()打开一个新的浏览器窗口或查找一个已命名的窗口
close()关闭浏览器窗口
print()打印当前窗口的内容
focus()把键盘焦点给予一个窗口
blur()把键盘窗口从顶层窗口移开
moveBy()可相对窗口的当前坐标把它移动指定像素
moveTo()可相对窗口的左上角移动到一个指定的坐标
resizeBy()按照指定的像素调整窗口的大小
resizeTo()把窗口的大小调整到指定的宽度和高度
scrollBy()按照指定的像素值来滚动内容
scrollTo()把内容滚动到指定的坐标
setInterval()每个指定的时间执行代码
setTimeout()在制定的延迟时间之后来执行代码
clearInterval()取消setInterval()的设置
clearTimeout()取消setTimeout()的设置
2、JavaScript计时器
在JavaScript中,我们可以在设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行
计时器类型:
一次性计时器:仅在指定的延迟时间之后触发一次
间隔性触发计时器:每个一定的时间间隔就触发一次。
计时器方法:
setTimeout() 指定延迟时间之后来执行代码
clearTimeout() 取消setTimeout()设置
setInterval() 每个指定的时间执行代码
clearInterval()取消setInterval()设置
3、计时器setInterval()
在执行时,从载入页面后每隔指定的时间执行代码。
语法:
setInterval(代码,交互时间);
参数说明:
1. 代码:要调用的函数或要执行的代码串。
2. 交互时间:周期性执行或调用表达式之间的时间间隔,以毫秒计(1s=1000ms)。
返回值:
一个可以传递给 clearInterval() 从而取消对"代码"的周期性执行的值。
4、取消计时器clearInterval()
clearInterval()方法可取消由setInterval()设置的交互时间
语法:
clearInterval(id_of_setInterval)
参数说明:
id_of_setInterval: 由setInterval()返回ID值
5、计时器setTimeout()
setTimeout()计时器,再载入后延迟指定时间后,去执行一次表达式,仅执行一次
语法:
setTimeout(代码,延迟时间);
参数说明:
1、要调用的函数或要执行的代码串
2、延迟时间:执行代码前需等待的时间,以毫秒为单位
6、取消计时器clearTimeout()
setTimeout()和clearTimeout()一起使用,停止计时器。
语法:
clearTimeout(id_of_setTimeout)
参数说明:
id_of_setTimeout:由setTimeout()返回的ID值,该值表示要取消的延迟执行代码块。
7、History对象
history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能。
注意:
从窗口被打开的那一刻开始记录,每个浏览器窗口、每个标签页乃至每个框架,都有自己的history对象与特定的window对象关联。
语法:
window.history.[属性|方法]
注意:
window可以省略
History对象属性
length 返回浏览器历史列表中的URL数量
History对象方法
back()加载history列表中的前一个URL
forward()加载history列表中的下一个URL
go()加载history列表中的某个具体的页面
8、返回前一个浏览的页面
back()方法,加载history列表中的前一个URL
语法:
windows.history.back()
注意:
等同于点击浏览器的倒退按钮
back()相当于go(-1)
9、返回下一个浏览的页面
forward()方法,加载 history 列表中的下一个 URL。
如果倒退之后,再想回到倒退之前浏览的页面,则可以使用forward()方法,代码如下:
window.history.forward();
注意:等价点击前进按钮。
forward()相当于go(1)
10、返回浏览历史中的其他页面
go()方法,根据当前所处的页面,加载 history 列表中的某个具体的页面。
语法:
window.history.go(number);
参数:
1 前一个,go(1)等价forward()
0 当前页面
-1 后一个,go(-1)等价back()
其他数值 要访问的URL在History的URL列表中的相对位置
11、Location对象
location用于获取或设置窗体的URL,并且可以用于解析URL
语法:
location.[属性][方法]
location对象属性
href:http://www.imooc.com:8080/list.php?courseid=8&chapterid=86#mediaid118
设置或返回完整的URL
protocol:http
设置或返回当前的协议
host:www.imooc.com:8080
设置或返回主机名和当前URL的端口号
hostname:www.imooc.com
设置或返回当前URL的主机名
port:8080
设置或返回当前URL的端口号
pathname:list.php
设置或返回当前URL的路径部分
search:courseid=8&chapterid=86
设置或返回从?开始的URL(查询部分)
hash:mediaid118
设置或返回从#开始的URL(锚)
location对象方法:
assign()加载新的文档
reload()重新加载当前的文档
replace()用新的文档替换当前文档
12、Navigator对象
Navigator对象包含浏览器的信息,通常用于监测浏览器与操作系统的版本
对象属性:
appCodeName 浏览器代码名的字符串表示
appName 返回浏览器的名称
appVersion 返回浏览器的平台和版本信息
platform 返回运行浏览器的操作系统平台
userAgent 返回由客户机发送服务器的user-agent头部的值
13、userAgent
返回用户代理头的字符串表示(就是包括浏览器版本信息等的字符串)
语法:
navigator.userAgent
几种浏览的user_agent.,像360的兼容模式用的是IE、极速模式用的是chrom的内核。
chrome:Mozilla/5.0(Windows NT 6.1;WOW64)AppleWebKit/537.36(KHTML,like Gecko)chrome/34.0.1847.116 Safari/537.36
fireFox :Mozilla/5.0(WindowsNT6.1;WOW64;rv:24.0)Gecko/20100101 fireFox/24.0
IE8:Mozilla/4.0(compatible;MSIE 8.0;Windows NT 6.1;WOW64;Trident/4.0;SLCC2;NET CLR2.0.50727;NET CLR3.5.30729;.NET CLR3.0.30729;.NET4.0C)
if(u_agent.indexOf("Firefox")>-1){
B_name="Firefox"; }
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置,如果找不到这个字符串会返回-1,找到的话返回字符串所在的位置
14、screen对象
screen对象用于获取用户的屏幕信息。
语法:
windows.screen.属性
availHeight 窗口可以使用的屏幕高度,单位px
availWidth 窗口可以使用的屏幕宽度,单位px
colorDepth 用户浏览器表示的颜色位数,通常32位(每像素的位数)
pixelDepth: 用户浏览器表示的颜色位数,通常32位(每像素的位数)IE不支持
height 屏幕的高度,单位px
width 屏幕的宽度,单位px
15、屏幕分辨率的高和宽
window.screen 对象包含有关用户屏幕的信息。
1. screen.height 返回屏幕分辨率的高
2. screen.width 返回屏幕分辨率的宽
注意:
1.单位以像素计。
2. window.screen 对象在编写时可以不使用 window 这个前缀。
16、屏幕可用高和宽度
1. screen.availWidth 属性返回访问者屏幕的宽度,以像素计,减去界面特性,比如任务栏。
2. screen.availHeight 属性返回访问者屏幕的高度,以像素计,减去界面特性,比如任务栏。
注意:
不同系统的任务栏默认高度不一样,及任务栏的位置可在屏幕上下左右任何位置,所以有可能可用宽度和高度不一样。
var num=document.getElementById("second").innerHTML;
//获取显示秒数的元素,通过定时器来更改秒数。
function count()
{
num--;
document.getElementById("second").innerHTML=num;
if(num==0)
{
location.assign("www.imooc.com");
}
}
setInterval("count()",1000);
JavaScript系列四:浏览器对象
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。