美文网首页
2.location 对象

2.location 对象

作者: 唐唐_sugar | 来源:发表于2016-09-19 16:39 被阅读0次

location对象是一个很特别的对象:既是window对象的属性,又是元素document对象的属性。即:window.location === document.location

location对象的所有属性:

  • hash —— 返回URL中的hash
  • host —— 返回服务器名称和端口号
  • hostname —— 返回不带端口号的服务器名称
  • href —— 返回当前加载页面的完整URL(同location.toString()的返回值)
  • pathname —— 返回URL中的目录和/或文件名
  • port —— 返回URL中指定的端口号
  • protocol —— 返回页面使用的协议
  • search —— 返回UTL的查询字符串。此字符串以问号开头

1. 查询字符串参数

location.search没有办法逐个访问其中的每个查询字符串参数。故可以创建这样的函数,以解析查询字符串,然后返回包含所有参数的一个对象

function getQueryStringArgs(){
    // 假设url为 https://www.google.co.jp/?hl=zh-cn&gws_rd=cr&ei=MFDjV73sHYHa0ASqnLvoAw#hl=zh-cn&q=2016%E5%B9%B4github%E4%B8%8A%E5%8D%81%E5%A4%A7+%E5%89%8D%E7%AB%AF
    // 取得查询字符串并去掉开头的问号 —— location.search得到的是url问号后的字符串
    var qs = (location.search.length > 0 ? location.search.substring(1) : ""),
        args = {},  //保存数据的对象
        items = qs.length ? qs.split("&") : [], //取得每一项
        item = null,
        name = null,
        value = null,
        i = 0,      //在for循环中使用
        len = items.length;
    //逐个将每一项添加到args对象中
    for (i = 0; i < len; i++) {
        item = items[i].split("=");
        name = decodeURIComponent(item[0]);
        value = decodeURIComponent(item[1]);
        if (name.length) {
            args[name] = value;
        }     
    }
    return args;
}

2.位置操作

使用location对象可以通过很多方式来改变浏览器的位置。最常用方式:使用assign()方法并为其传递一个URL

location.assign("http://www.baidu.com");

在改变浏览器位置的方法中,最常用的是设置location.href属性。此外,修改location对象的其他属性(hash、search、jostname、pathname、port)也可改变当前加载的页面。

  • replace()方法 用户不能回到前一个页面
  • reload()方法 重新加载当前显示的页面
location.reload();  //页面会以最有效的方式重新加载(有可能从缓存中重新加载—)
location.reload(true)   //强制从服务器重新加载

相关文章

  • JavaScriptBOM__History_location(

    目录: 1.History对象 2.location对象 一、History对象 1.什么是History His...

  • 2.location 对象

    location对象是一个很特别的对象:既是window对象的属性,又是元素document对象的属性。即:win...

  • 16.BOM

    学习要点: 1.window 对象2.location 对象3.history 对象 BOM 也叫浏览器对象模型,...

  • Day08 JS

    1. 定时器 2.location 3.navigator 4.节点 Demo 4.元素位置 5.属性设置 Dem...

  • 对象,对象?对象……(2/100)

    在学校的时候谈过2个男朋友,分手的时候觉得自己都活不下去了,要不要像电视剧里那样一了百了呢?可是最后还是那样过来了...

  • 对象 - js对象

    1.Array对象 对象属性:1)constructor 2)length prototype允许你向数组对象添加...

  • date对象/正则对象/JSON对象

    date对象 原文 UTC时间:世界标准时间 时间戳:时间戳是一个自增的整数,它表示从1970年1月1日零时整的G...

  • DOM对象、JS对象、jQuery对象

    一、背景 当我写出以下代码: 运行之后报错: Uncaught TypeError: $allButtons[(n...

  • 找对象!找对象!找对象!

    我每次一到夏天,最想做的事情就是找对象!但感觉自己好像命中孤苦,老大不小了,也没恋爱可谈。我不是那种很会撩妹的人,...

  • javascript 对象 本地对象、内置对象和宿主对象

    在ECMAScript中,所有对象并非同等创建的。 一般来说,可以创建并使用的对象有3种:本地对象、内置对象和宿主...

网友评论

      本文标题:2.location 对象

      本文链接:https://www.haomeiwen.com/subject/rhdnettx.html