Location对象分析

今天分析下Location对象，以及一些相关的信息

URL：统一资源定位符（Uniform Resource Locator）由下面几个部分构成：

    scheme://host:port/path?query#fragment

 scheme：通信协议，常用的有 http,ftp,maito 等

像上面截图看到的：

1.location.href

获取地址栏所有内容

例如：https://ant.design/components/modal-cn/#header

2.location.protocol

URL协议部分

例如：https:

3.location.host

URL的主机部分，包括端口号。返回服务器名称 + 端口号

例如：ant.design

4.location.port

URL中的端口号，如果采用默认的80端口，那么返回的是空字符串

例如：""

5.location.pathname

URL的路径部分（就是文件地址）

例如：/components/modal-cn/

6.location.search

查询（参数）部分，从？开始

例如：?preview_height=50&open_file=src/app.js

7.location.hash

获取锚点

例如：#header

8.location.hostname

URL的主机部分，不包括端口号（注意它与host的区别）.不带端口号的服务器名称

例如：ant.design

9.location.origin

返回URL协议 + 服务器名称 + 端口号 （location.origin = location.protocol + '//' + location.host）

例如：https://ant.design

方法：

10.location.assign()

跳转链接，立即打开新的 URL 并在浏览器的历史记录中生成一条记录，回退可返回

11.location.replace()

跳转链接，立即打开新的URL，不会在历史记录中生成一个记录，回退不可返回

12.location.reload()

重新加载当前显示的页面：

参数：无 --- 就会使用最有效的方式重新加载页面，可能从浏览器缓存中重新加载

参数：true --- 那么就会强制从服务器重新加载

补充：

“相对路径”和“绝对路径”的比较

"."：相对路径，代表目前所在的目录

".."：相对路径，代表上一层目录

"/"：代表根目录

在项目发布中，表示根目录，注意根目录是location.host开始找的，如果找不到文件，可能没有从pathname目录里面找