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 对象的更多相关文章

  1. JavaScript -- 时光流逝（十三）：DOM -- Console 对象

    JavaScript -- 知识点回顾篇(十三):DOM -- Console 对象 (1) assert() : 如果断言为 false,则在信息到控制台输出错误信息.(2) clear() : 清 ...

  2. JavaScript -- 时光流逝（十一）：DOM -- Document 对象

    JavaScript -- 知识点回顾篇(十一):DOM -- Document 对象 (1) document.activeElement: 返回文档中当前获得焦点的元素. <!doctype ...

  3. JavaScript -- 时光流逝（十二）：DOM -- Element 对象

    JavaScript -- 知识点回顾篇(十二):DOM -- Element 对象 (1) element.accessKey: 设置或返回accesskey一个元素,使用 Alt + 指定快捷键 ...

  4. JavaScript -- 时光流逝（九）：Window 对象、Navigator 对象

    JavaScript -- 知识点回顾篇(九):Window 对象.Navigator 对象 1. Window 对象 1.1 Window 对象的属性 (1) closed: 返回窗口是否已被关闭. ...

  5. JavaScript -- 时光流逝（五）：js中的 Date 对象的方法

    JavaScript -- 知识点回顾篇(五):js中的 Date 对象的方法 Date 对象: 用于处理日期和时间. 1. Date对象的方法 <script type="text/ ...

  6. JS浏览器对象：window对象、History、Location对象、Screen对象

    一.JS浏览器对象-window 1.window对象 window对象是BOM的核心,window对象指当前的浏览器窗口 所有JavaScript全局对象.函数以及变量均自动成为window对象的成 ...

  7. JavaScript -- 时光流逝（六）：js中的正则表达式 -- RegExp 对象

    JavaScript -- 知识点回顾篇(六):js中的正则表达式 -- RegExp 对象 1. js正则表达式匹配字符之含义      查找以八进制数 规定的字符.     查找以十六进制数 规定 ...

  8. JavaScript -- 时光流逝（四）：js中的 Math 对象的属性和方法

    JavaScript -- 知识点回顾篇(四):js中的 Math 对象的属性和方法 1. Math 对象的属性 (1) E :返回算术常量 e,即自然对数的底数(约等于2.718). (2) LN2 ...

  9. JavaScript -- 时光流逝（三）：js中的 String 对象的方法

    JavaScript -- 知识点回顾篇(三):js中的 String 对象的方法 (1) anchor(): 创建 HTML 锚. <script type="text/javasc ...

随机推荐

  1. Perl和操作系统交互(一)：system、exec和反引号

    调用操作系统命令:system函数 system函数可以直接让perl调用操作系统中的命令并执行. system入门示例 例如: #!/usr/bin/perl system 'date +" ...

  2. linux安装配置zookeeper-3.4.10

    此文是基于上一篇文章:hadoop集群搭建 安装zookeeper: [在各个slave节点安装zookeeper] 下载地址:http://mirror.bit.edu.cn/apache/zook ...

  3. SELECT INTO和INSERT INTO SELECT的区别

    数据库中的数据复制备份 SELECT INTO: 形式: SELECT value1,value2,value3 INTO Table_2 FROM Table_1 Table_2表存在,报错:数据库 ...

  4. 利用谷歌网站的翻译网站，实现谷歌翻译api

    代码是之前网上找到的,地址为:http://www.crifan.com/teach_you_how_to_find_free_google_translate_api/ 原先的代码有不足,如果翻译里 ...

  5. [android] 显示意图激活另外一个activity

    可以使用跳转的方式类似javaweb来实现界面转换 显示意图就是必须要指定开启组件的具体信息,包名,组件名,组件的class 新建一个类TwoActivity ,继承Activity类,重写onCre ...

  6. nginx常用命令参数

    命令行参数: 常用命令: -c filename:设置配置文件. -t :不运行,而仅仅测试配置文件.nginx 将检查配置文件的语法的正确性,并尝试打开配置文件中所引用到的文件. -s :传递一个信 ...

  7. 解决MyEclipse中install new software问题

    eclipse中点击help可以直接找到install new software选项进行安装插件,但是在Myeclipse中help没有这个选项,如下提供几种解决方法 Windows-preferen ...

  8. 你还在等着用户反馈BUG?

    译者按: 等待用户反馈BUG,一切都晚了!实时监控线上应用才是王道. 原文: Why relying on your users to report errors is the dumbest thi ...

  9. js 判断数组中是否有重复值

    function arrHasvalue(arr) { var nary = arr.sort(); for (var i = 0; i < arr.length; i++) { if (nar ...

  10. 定时任务Crontab

    0.基本概念 & 实现原理  定时任务基本概念: 调度器:负责管理Quartz应用运行时环境,用于调度定时任务. 定时任务:按照某种时间规则,被调度的任务. a.从有无状态来说,有以下两种: ...