• javascript的浏览器Bom详解,window、location、history对象


           BOM(BrowserObjectModel)也叫浏览器对象模型,描述与浏览器进行交互的方法和接口。BOM由多个对象组成,

    其中代表浏览器窗口的Window对象是BOM的顶层对象,其他对象都是该对象的子对象。

           JavaScript由三部分组成:ECMAScript,BOM,DOM。BOM提供了很多对象,用于访问浏览器的功能。

    下面介绍浏览器的三个公共对象:window对象,location对象,history对象。

    window对象

    BOM 的核心对象是window,它表示浏览器的一个实例。在浏览器中,window 对象有双重角色,
    它既是通过JavaScript 访问浏览器窗口的一个接口,又是ECMAScript 规定的Global 对象。这意味着
    在网页中定义的任何一个对象变量函数,都以window 作为其Global 对象

    window对象的比较常用的知识点:全局作用域、窗口宽高、窗口位置、定时器的设置

    获取窗口大小

    通过以下代码可以跨浏览器获取页面视口大小

     
    var pageWidth = window.innerWidth,
        pageHeight = window.innerHeight;
    if(typeof pageWidth !="number"){
        if (document.compatMode == "CSS1Compat"){
            pageWidth = document.documentElement.clientWidth;
            pageHeight = document.documentElement.clientHeight;
            }
        else {
            pageWidth = document.body.clientWidth;
            pageHeight = document.body.clientHeight;
         }
    }
    

      

    location对象

    location 是最有用的BOM对象之一,它提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能
    以下是location对象的属性列表.

      1. hash 返回URL中的hash(#号后跟零或多个字符),如果URL中不包含散列,则返回空字符串,例"#contents"

      2. host 返回服务器名称和端口号(如果有).例"www.zhaosywz.com:80"

      3. hostname 返回不带端口号的服务器名称.例"www.zhaosywz.com"

      4. href 返回当前页面的完整url.例"www.zhaosywz.com/index.html"

      5. pathname 返回url中的目录或文件名,例"/category/shoes"

      6. port 返回url的端口号,如果没有则返回空字符串.例"8080"

      7. protocol 返回页面使用的协议。通常是http:或https:

      8. search 返回URL的查询字符串。这个字符串以问号开头,'?id=100

        

    通过以下任何一种方式都会导致页面的跳转或重载

    location.href = "http://www.baidu.com";
    location.hash = "#section1";
    location.search = "?q=javascript";
    location.hostname = "www.yahoo.com";
    location.pathname = "mydir";
    location.port = 8080;

    通过reload()可以重新加载当前页面

    location.reload(); //重新加载(有可能从缓存中加载)
    location.reload(true);//重新加载(直接从服务器加载)

    history对象

    history 对象保存着用户上网的历史记录,从窗口被打开的那一刻算起。

     
    //后退一页
    history.go(-1);
    
    //前进一页
    history.go(1);
    
    //前进两页
    history.go(2);
    
    //跳转到最近的包含'wrox.com'字符的页面
    history.go("wrox.com");
    
    //后退一页
    history.back();
    //前进一页
    history.forward();
    
    if (history.length == 0){
    //这应该是用户打开窗口后的第一个页面
    }

    history对象是window对象的属性,它保存着用户上网的记录,从窗口被打开的那一刻算起

     

     

  • 相关阅读:
    C# 关于类的事件和委托
    C# 多态
    C# 声明方法的语法
    C# 面向对象基础
    近期发现的一些.net资源
    asp.net 2.0学习资源
    设置VSS使支持通过Internet访问
    大型社区设计:提高用户体验的10个细节
    委托的用法
    有滚动条、固定Header的ASP.Net DataGrid实现
  • 原文地址:https://www.cnblogs.com/suzhen-2012/p/5849994.html
Copyright © 2020-2023  润新知