JavaScript -- 时光流逝(十):Screen 对象、History 对象、Location 对象
JavaScript -- 知识点回顾篇(十):Screen 对象、History 对象、Location 对象
1. Screen 对象
1.1 Screen 对象的属性
(1) availHeight: 返回屏幕的高度(不包括Windows任务栏)
(2) availWidth: 返回屏幕的宽度(不包括Windows任务栏)
(3) colorDepth: 返回目标设备或缓冲器上的调色板的比特深度
(4) height: 返回屏幕的总高度
(5) pixelDepth: 返回屏幕的颜色分辨率(每像素的位数)
(6) width: 返回屏幕的总宽度
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
document.write("可用高度: " + screen.availHeight);
document.write("<br/>可用宽度: " + screen.availWidth);
document.write("<br/>颜色深度: " + screen.colorDepth);
document.write("<br/>总高度: " + screen.height);
document.write("<br/>总宽度: " + screen.width);
document.write("<br/>颜色分辨率: " + screen.pixelDepth);
</script>
</head>
<body>
</body>
</html>

2. History 对象
2.1 History 对象的属性
(1) length: 返回历史列表中的网址数
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
document.write("历史列表中URL的数量: " + history.length);
</script>
</head>
<body>
</body>
</html>

2.2 History 对象的方法
(1) back(): 加载 history 列表中的前一个 URL
(2) forward(): 加载 history 列表中的下一个 URL
(3) go(): 加载 history 列表中的某个具体页面
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
function my_back(){
window.history.back()
}
function my_forward(){
window.history.forward()
}
function my_go(){
window.history.go(-2)
}
</script>
</head>
<body>
<input type="button" value="back()方法" onclick="my_back()">
<input type="button" value="forward()方法" onclick="my_forward()">
<input type="button" value="go()方法" onclick="my_go()">
</body>
</html>
3. Location 对象
3.1 Location 对象的属性
(1) hash: 返回一个URL的锚部分
(2) host: 返回一个URL的主机名和端口
(3) hostname: 返回URL的主机名
(4) href: 返回完整的URL
(5) pathname: 返回的URL路径名。
(6) port: 返回一个URL服务器使用的端口号
(7) protocol: 返回一个URL协议
(8) search: 返回一个URL的查询部分
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
document.write(location.hash);
document.write('<br/>'+location.host);
document.write('<br/>'+location.hostname);
document.write('<br/>'+location.href);
document.write('<br/>'+location.pathname);
document.write('<br/>'+location.port);
document.write('<br/>'+location.protocol);
document.write('<br/>'+location.search);
</script>
</head>
<body>
</body>
</html>
3.2 Location 对象的方法
(1) assign(): 载入一个新的文档
(2) reload(): 重新载入当前文档
(3) replace(): 用新的文档替换当前文档
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
function my_assign(){
window.location.assign("https://www.baidu.com")
}
function my_reload(){
location.reload()
}
function my_replace(){
window.location.replace("https://www.hao123.com")
}
</script>
</head>
<body>
<input type="button" value="assign()方法" onclick="my_assign()">
<input type="button" value="reload()方法" onclick="my_reload()">
<input type="button" value="replace()方法" onclick="my_replace()">
</body>
</html>
JavaScript -- 时光流逝(十):Screen 对象、History 对象、Location 对象的更多相关文章
- JavaScript -- 时光流逝(十三):DOM -- Console 对象
JavaScript -- 知识点回顾篇(十三):DOM -- Console 对象 (1) assert() : 如果断言为 false,则在信息到控制台输出错误信息.(2) clear() : 清 ...
- JavaScript -- 时光流逝(十一):DOM -- Document 对象
JavaScript -- 知识点回顾篇(十一):DOM -- Document 对象 (1) document.activeElement: 返回文档中当前获得焦点的元素. <!doctype ...
- JavaScript -- 时光流逝(十二):DOM -- Element 对象
JavaScript -- 知识点回顾篇(十二):DOM -- Element 对象 (1) element.accessKey: 设置或返回accesskey一个元素,使用 Alt + 指定快捷键 ...
- JavaScript -- 时光流逝(九):Window 对象、Navigator 对象
JavaScript -- 知识点回顾篇(九):Window 对象.Navigator 对象 1. Window 对象 1.1 Window 对象的属性 (1) closed: 返回窗口是否已被关闭. ...
- JavaScript -- 时光流逝(五):js中的 Date 对象的方法
JavaScript -- 知识点回顾篇(五):js中的 Date 对象的方法 Date 对象: 用于处理日期和时间. 1. Date对象的方法 <script type="text/ ...
- JS浏览器对象:window对象、History、Location对象、Screen对象
一.JS浏览器对象-window 1.window对象 window对象是BOM的核心,window对象指当前的浏览器窗口 所有JavaScript全局对象.函数以及变量均自动成为window对象的成 ...
- JavaScript -- 时光流逝(六):js中的正则表达式 -- RegExp 对象
JavaScript -- 知识点回顾篇(六):js中的正则表达式 -- RegExp 对象 1. js正则表达式匹配字符之含义 查找以八进制数 规定的字符. 查找以十六进制数 规定 ...
- JavaScript -- 时光流逝(四):js中的 Math 对象的属性和方法
JavaScript -- 知识点回顾篇(四):js中的 Math 对象的属性和方法 1. Math 对象的属性 (1) E :返回算术常量 e,即自然对数的底数(约等于2.718). (2) LN2 ...
- JavaScript -- 时光流逝(三):js中的 String 对象的方法
JavaScript -- 知识点回顾篇(三):js中的 String 对象的方法 (1) anchor(): 创建 HTML 锚. <script type="text/javasc ...
随机推荐
- [转]Docker和Rancher的安装与基本使用
本文转自:https://blog.csdn.net/wangshouhan/article/details/80405672 一.Docker1.CentOS下Docker安装 安装 $ yum - ...
- JavaScript匿名函数入门。
1.第一种匿名函数的使用:简单的调用 var f=function(){ return 'Hello'; }; //匿名函数没法调用,只能赋值,所以作为赋值语句后面得加分号 var result= ...
- 【转载】Asp.Net中使用基于jQuery的javascript前台模版引擎JTemplate
JTemplate是基于jQuery的开源的前端模版引擎,在Jtemplate模板中可以使用if判断.foreach循环.for循环等操作,使用Jtemplate模板优点在于ajax局部刷新界面时候不 ...
- lambda List实现某列去重的解决方案采用扩展方法
public class CommonEqualityComparer<T, V> : IEqualityComparer<T> { private Func<T, V& ...
- npm ERR! Cannot read property 'path' of null
npm错误: 错误信息如下: $ sudo npm install -g bean-sdk sudo: npm: command not found $ npm install -g bean-sdk ...
- 阿里云oss,简单上传
描述:oss比较方便,省去了自己搭建文件服务器的时间,价格比较便宜,下面是java基于oss的简单上传代码 a.添加maven依赖 <dependency> <groupId> ...
- WORLD F4快捷重复上一步操作
只需做一次动作,后面就直接按F4即可重复上一次操作.
- 亲测:LNMP环境下,解决项目缓冲慢、502以及配置https的问题
在做的项目在nginx下访问缓冲时间过长,明显比apache下访问蛮11倍有余, 解决办法: 1增加nginx的upstream,其中upstream中为php-cgi的地址: 2利用nginx作为反 ...
- Spring之AOP的注解配置
配置过程可以简单的分为3步: 1,业务类配置 在业务类前加入,将业务类交由Spring管理 @Component("s") 这个表示,这个业务类的Bean名字为 s . 2,将切点 ...
- BZOJ3453: tyvj 1858 XLkxc(拉格朗日插值)
题意 题目链接 Sol 把式子拆开,就是求这个东西 \[\sum_{i = 0} ^n \sum_{j = 1}^{a + id} \sum_{x =1}^j x^k \pmod P\] 那么设\(f ...