# 一. 获取浏览器URL的方法

1、window.location.href 整个URl字符串(在浏览器中就是完整的地址栏) 返回值：www.home.com:8080/windows/loc…

2、window.location.protocol URL 的协议部分。 返回值：http:

3、window.location.host URL 的主机部分(带端口号)， 返回值：www.home.com:8080 window.location.hostname 返回值：www.home.com

4、window.location.port URL 的端口部分。如果采用默认的80端口(update:即使添加了:80)，那么返回值并不是默认的80而是空字符。

5、window.location.pathname URL 的路径部分(就是文件地址) 返回值：/windows/location/page.html

6、window.location.search 查询(参数)部分。除了给动态语言赋值以外，我们同样可以给静态页面,并使用javascript来获得相信应的参数值 返回值：?ver=1.0&id=timlq

7、window.location.hash 锚点。返回值：#love

二. 获取地址栏中get参数并放入对象中

方法:1.1

    let url = 'http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e';
    function serilizeUrl(url) {
      let urlObj = {}  
      if (/\?/.test(url)) {
        let urlStr = url.substring(url.indexOf('?') + 1)
        let urlArr = urlStr.split('&')
        let len = urlArr.length

        for (let i = 0; i < len; i++) {
          let urlItem = urlArr[i]
          let item = urlItem.split('=')
          urlObj[item[0]] = item[1]
        }
        return urlObj
      }
}
console.log(serilizeUrl(url)) 

方法:1.2 使用js内置对象Array的reduce方法

    let url = 'http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e'
    function serilizeUrl(url) {
      if (/\?/.test(url)) {
        let urlStr = url.substring(url.indexOf('?') + 1)
        let urlArr = urlStr.split('&')
        return urlArr.reduce((acc, cur) => {
          let item = cur.split('=')
          acc[item[0]] = item[1]
          return acc
        }, {})
      }
    }
 console.log(serilizeUrl(url)) 
 

结果:

{a: "1", b: "2", c: "", d: "xxx", e: undefined}