BOM 对象--location、navigator、screen、history
1、location 对象
location提供了与当前窗口中加载的文档有关的信息,还有一些导航功能。需要注意的是,window.location 和 document.location 引用的是同一个对象。
location 对象的属性:
| 属性名 | 例子 | 说明 |
| hash | "#content" | 返回URL中的hash(#号后跟零或多个字符),如果没有hash,返回空字符串 |
| host | "www.baidu.com:8080" | 返回一个URL的主机名和端口(如果有) |
| hostname | "www.baidu.com" | 返回URL的主机名 |
| href | "http:/www.baidu.com/xxx/?s=oo" | 返回完整的URL |
| pathname | "/WileCs/" | 返回的URL中的目录和(或)文件名 |
| port | "8080" | 返回一个URL服务器使用的端口号 |
| protocol | "http:" | 返回一个URL协议,http或https |
| search | "?q=javascript | 返回一个URL的查询部分,以“?”开头 |
可以冲search中获取URL中的参数。
每次修改location的属性(hash除外),页面都会以新的URL重载。所以通常设置 location.href 来跳转页面。设置这些属性,浏览器的历史记录中就会生成一条新记录,所以用户可以点击浏览器的“后退”按钮都会导航到前一个页面。
方法:
1) location.assign(url); 立即打开新URL并在浏览器历史中生成一条记录。同 location.href = url ;window.location = url;
2) location.replace(url); 导航到URL,但不会再历史记录中生成新纪录,即 用户不能回到前一个页面。
3)location.reload([forceGet]); 重载页面。没有参数时,页面会以最有效的方式重载,如果页面没有变化,则从浏览器缓存中加载。传入 true ,则会强制从服务器加载。该语句最好放在最后一行。
2、navigator 对象
navigator 一般用来识别客户端浏览器类型的,每个浏览器各有一个定义。
| 属性 | 说明 |
|---|---|
| appCodeName | 返回浏览器的代码名,通常是Mozilla,即使在非Mozilla浏览器中也是如此 |
| appName | 返回浏览器的名称 |
| appVersion | 返回浏览器的平台和版本信息 |
| cookieEnabled | 返回指明浏览器中是否启用 cookie 的布尔值 |
| platform | 返回运行浏览器的操作系统平台 |
| userAgent | 返回由客户机发送服务器的user-agent 头部的值 |
| plugins | 返回浏览器中安装的插件信息数组 |
3、screen 对象
Screen 对象包含有关客户端显示屏幕的信息。没有应用于 screen 对象的公开标准,不过所有浏览器都支持该对象。
| 属性 | 说明 |
|---|---|
| availHeight | 返回屏幕的高度(不包括Windows任务栏) |
| availWidth | 返回屏幕的宽度(不包括Windows任务栏) |
| colorDepth | 返回目标设备或缓冲器上的调色板的比特深度 |
| height | 返回屏幕的总高度 |
| pixelDepth | 返回屏幕的颜色分辨率(每象素的位数) |
| width | 返回屏幕的总宽度 |
4、history 对象
history 对象包含用户(在浏览器窗口中)访问过的 URL,历史记录,从窗口打开时算起。
history 对象是 window 对象的一部分,可通过 window.history 属性对其进行访问。每个浏览器窗口、每个标签页、每个框架,都有自己的 history
| 属性/方法 | 说明 |
|---|---|
| length | 返回历史列表中的网址数 |
| back() | 加载 history 列表中的前一个 URL |
| forward() | 加载 history 列表中的下一个 URL |
| go() | 加载 history 列表中的某个具体页面 |
go() 方法可以在历史记录中随意跳转。history.go(number|URL)
该参数可以是数字,使用的是要访问的 URL 在 History 的 URL 列表中的相对位置。(-1上一个页面,1前进一个页面)。或一个字符串,字符串必须是局部或完整的URL,该函数会去匹配字符串的第一个URL。
history.go("xxxx.com"); -->跳到最近的 “xxxx.com”页面
history.length 等于 0 ,表明这个页面是用户打开的第一个页面
BOM 对象--location、navigator、screen、history的更多相关文章
- JavaScript之BOM五大对象(window;location;navigator;screen;history)
一.window 1.浏览器窗口与页面各部分尺寸 2.间歇调用与超时调用 setInterval(function,time(以毫秒计)) 返回:时间Id号(为clearInterval(timeId ...
- 《JAVASCRIPT高级程序设计》window/location/navigator/screen/history对象
如果要在web中使用JAVASCRIPT,那么BOM(浏览器对象模型)毫无疑问是最重要的部分.BOM提供了很多对象,例如,window.location.navigator.screen.histor ...
- BOM对象——Location
BOM对象--location <!DOCTYPE html> <html> <head> <meta charset="utf-8"&g ...
- JavaScript基础--DOM对象(十三):(windows对象:history\location\navigator\screen\event)
DOM编程1.为什么要学习DOM(1) 通过dom编程,我们可以写出各种网页游戏(2)dom编程也是ajax的重要基础2.DOM编程介绍DOM = Document Object Model(文档对象 ...
- (转)浏览器对象window,history,location,navigator,screen
1.window对象:当前的浏览器窗口 window对象是BOM的核心,window对象指当前的浏览器窗口 所有JavaScript全局对象.函数以及变量均自动成为window对象的成员 全局变量是w ...
- JavaScript---Bom树的操作,内置方法和内置对象(window对象,location对象,navigator对象,history对象,screen对象)
JavaScript---Bom树的操作,内置方法和内置对象(window对象,location对象,navigator对象,history对象,screen对象) 一丶什么是BOM B ...
- 【JavaScript】BOM对象——Window对象&History对象&Location 对象
1.Window对象: 表示浏览器中打开的窗口 setInterval():它有一个返回值,主要是提供给 clearInterval 使用. setTimeout():它有一个返回值,主要是提供给 c ...
- Javascript进阶篇——浏览器对象—Location、Navigator、userAgent、screen对象
Location对象location用于获取或设置窗体的URL,并且可以用于解析URL.语法: location.[属性|方法] location对象属性图示: location 对象属性: loca ...
- Javascript高级编程学习笔记(31)—— BOM(5)screen、history对象
screen对象 screen对象应该是BOM对象中最不常用的对象了 其主要用于提供客户端的显示能力信息 包括浏览器外部显示的信息,和像素的宽高等 这个对象的主要用于检测客户端能力,一般不会影响功能 ...
随机推荐
- org.springframework.web.servlet.PageNotFound - No mapping found for HTTP request with URI
在重启项目中会遇到[org.springframework.web.servlet.PageNotFound] - No mapping found for HTTP request with URI ...
- 26.纯 CSS创作按钮被从纸上掀起的立体效果
原文地址:https://segmentfault.com/a/1190000014930183 感想:主要2D和3D转换.阴影效果. HTML代码: <nav> <ul> & ...
- python学习笔记_week6_面向对象
面向对象 介绍(特性(class.object--->封装.继承,多态)).--->世界万物,皆可分类:世界万物,皆可对象 只要是对象,就肯定属于某种品类:只要是对象,就肯定有属性 你是上 ...
- Termux 详细安装
termnux安装方法 https://blog.csdn.net/u010475354/article/details/79675893 使用Termux把Android手机变成SSH服务器 htt ...
- python __class__属性
>>> class a(object): pass >>> o=a() >>> dir(o) ['__class__', '__delattr__ ...
- ThinkPHP输入验证和I方法使用
在Web开发过程中,我们经常需要获取系统变量或者用户提交的数据,这些变量数据错综复杂,而且一不小心就容易引起安全隐患,但是如果利用好ThinkPHP提供的变量获取功能,就可以轻松的获取和驾驭变量了. ...
- MySQL创建只读账号
应用场景:只要公司有数据团队的,那免不了让这帮家伙把全公司的数据库数据都摸一遍,但是要是直接把root用户给了他们,未免有点危险,于是只能给这帮人设权限,一般而言,他们只是做读操作,既然做读操作,那么 ...
- include 模板标签
{%load staticfiles %}就能使用include标签了 {% include %}该标签允许在(模板中)包含其他的模板的内容,标签的参数是所要包含的模板名称,可以是一个变量,也可以是用 ...
- Eclipse实用操作
1.缩进:Tab 2.退格:Shift+Tab 3.包结构展开方式:Package Presentation 4.快速定位文件:按ctrl键不放,鼠标移至链接处 5.为属性快速生成相应的get和set ...
- for里的上一个/下一个下标的安全写法
const len:int=10; for(var:int=0;i<len;i++){ var previ:int=(i-1+len)%len; var nexti:int=(i+1)%len; ...