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. ORA-28002：the password will expire within 6 days

    1.查看用户的proifle SELECT username,PROFILE FROM dba_users; 2.查看指定概要文件(如default)的密码有效期设置:SELECT * FROM db ...

  2. 基于 LWIP 建立 TCP Server 与主机通信实验

    LWIP 版本:2.0.3 上一篇文章是写如何将 LWIP 移植到板子上,今天晚上记录基于 LWIP 实现与主机的网络通信. 先是打开了原子的实验例程,大概浏览了一遍,觉得 TCP 网络网络通信也就是 ...

  3. 一个Android常用的组件收集

    Android笔记之ViewPager实例一:制作欢迎引导界面:http://www.cnblogs.com/xingyyy/p/3335705.html Fragment 实现底部菜单栏:http: ...

  4. 在JS方法中返回多个值的三种方法（转载）

    来源:https://www.cnblogs.com/gxsyj/p/6004574.html 在使用JS编程中,有时需要在一个方法返回两个个或两个以上的数据,用下面的几种方法都可以实现: 1 使用数 ...

  5. [PHP] 算法-字符串的全排列的PHP实现

    输入一个字符串,按字典序打印出该字符串中字符的所有排列.例如输入字符串abc,则打印出由字符a,b,c所能排列出来的所有字符串abc,acb,bac,bca,cab和cba. 思路: 1.利用递归形成 ...

  6. redis/memcached可视化客户端工具TreeNMS

    RedisDesktopManager 之前用的redis客户端工具还不错,今天发现一个国产的nosql客户端,还挺方便滴 TreeNMS是一款redis,Memcache可视化客户端工具,采用JAV ...

  7. 16.QT-QMap和QHash解析

    QMap QMap原型为class QMap <K,T>,其中K表示键,T表示值,K和T属于映射关系. QMap会根据K来自动进行升序键排序 QMap中的K类型必须重载operator & ...

  8. 异常: Call From * 9000 failed on connection exception: java.net.ConnectException: Connection refused: no further information; For more details see: http://wiki.apache.org/hadoop/ConnectionRefused

    场景: eclipse链接不上阿里云hadoop解决: 将hadoop的配置文件中的ip改为内网IP即可

  9. CSS gradient渐变之webkit核心浏览器下的使用以及实例

    一.关于渐变 渐变是一种应用于平面的视觉效果,可以从一种颜色逐渐地转变成另外一种颜色,故可以创建类似于彩虹的效果渐变可以应用在任何可以使用图片的地方.例如,您可以指定一个这么一个渐变:顶部的颜色是红色 ...

  10. js内置对象-Object

    1)Object构造函数的方法 返回指定对象的原型对象 Object.getPrototypeOf(mymap); /*{featureStyle: {…}, selfLayersCount: nul ...