提供了当前窗口中加载文档的信息，以及通常的导航功能。
它既是 window 的属性，也是 document 的属性。

假设URL 是 [http://foouser:barpassword@www.wrox.com:80/WileyCDA/?q=javascript#contents](http://foouser:barpassword@www.wrox.com:80/WileyCDA/?q=)
image.png

查询字符串

location.search 返回了从问号开始直到URL未必的所有内容，但没有办法逐个访问每个查询参数。
只能用函数拆解解析查询字符串，并返回一个以每个查询参数为属性的对象

  1. let getQueryStringArgs = function() { 
  2.   // 取得没有开头问号的查询字符串
  3.   let qs = (location.search.length > 0 ? location.search.substring(1) : ""), 
  4.       // 保存数据的对象
  5.       args = {}; 
  6.   // 把每个参数添加到 args 对象
  7.   for (let item of qs.split("&").map(kv => kv.split("="))) { 
  8.     let name = decodeURIComponent(item[0]), 
  9.         value = decodeURIComponent(item[1]); 
  10.     if (name.length) { 
  11.       args[name] = value; 
  12.     } 
  13.   } 
  14.   return args;
  15. }

URLSearchParams

可以检查和修改查询字符串

  1. let qs = "?q=javascript&num=10"; 
  2. let searchParams = new URLSearchParams(qs); 
  3. alert(searchParams.toString()); // " q=javascript&num=10" 
  4. searchParams.has("num"); // true 
  5. searchParams.get("num"); // 10 
  6. searchParams.set("page", "3"); 
  7. alert(searchParams.toString()); // " q=javascript&num=10&page=3" 
  8. searchParams.delete("q"); 
  9. alert(searchParams.toString()); // " num=10&page=3"
  11. let qs = "?q=javascript&num=10"; 
  12. let searchParams = new URLSearchParams(qs); 
  13. for (let param of searchParams) { 
  14.   console.log(param); 
  15. } 
  16. // ["q", "javascript"] 
  17. // ["num", "10"]

操作地址

  • location.assign 启动导航到新的URL操作，同时在浏览器历史记录中增加一条记录

  • 修改location对象属性修改当前加载的页面

    • hash / search / hostname / pathname / port 修改后都会修改当前URL

      1. // 假设当前 URL 为 http://www.wrox.com/WileyCDA/ 
      2. // 把 URL 修改为 http://www.wrox.com/WileyCDA/#section1 
      3. location.hash = "#section1"; 
      4. // 把 URL 修改为 http://www.wrox.com/WileyCDA/?q=javascript 
      5. location.search = "?q=javascript"; 
      6. // 把 URL 修改为 http://www.somewhere.com/WileyCDA/ 
      7. location.hostname = "www.somewhere.com"; 
      8. // 把 URL 修改为 http://www.somewhere.com/mydir/ 
      9. location.pathname = "mydir"; 
      10. // 把 URL 修改为 http://www.somewhere.com:8080/WileyCDA/ 
      11. location.port = 8080;

    • 除了 hash 之外，只要修改 location 的一个属性，就会导致页面重新加载新 URL。

      • 修改hash值会在浏览器历史中增加一条新的记录
  • location.replace() 不增加历史记录，一接替换
    • 用户不能回到前一页
  • location.reload()
    • 参数 布尔值，是否强制从服务器重新加载
      • 默认为 false 可能是从缓存中加载