JavaScript | window.location 和 document.location 对象

window.location 和 document.location：这些对象用于获取 URL（当前或当前页面地址）并将浏览器转到新页面或窗口。两者的主要区别在于它们与浏览器的兼容性。

• window.location 在所有兼容的浏览器上都是读/写的。
• document.location 在 Internet Explorer 中是只读的，但在基于 Gecko 的浏览器 Firefox、SeaMonkey 中是读/写的。

所有现代浏览器都将 document.location 映射到 window.location，但您可以更喜欢 window.location 以确保跨浏览器的安全。

句法：

• window.location.href：返回当前工作页面的 URL。
• window.location.hostname：返回虚拟主机的域名。
• window.location.pathname：返回当前工作页面的路径和文件名。
• window.location.protocol：返回使用的协议（http: 或 https:）。
• window.location.port()：打印端口号。
• window.location.host()：它打印主机名和端口号。
• window.location.assign()：它加载新文档。

示例 1：此示例使用不同的属性来获取 URL 的不同部分。

  

    Get Different Part of a URL

  

    
  
        // Prints complete URL
        document.write("URL IS:  " 
                + window.location.href + "<br>");
  
        // Prints hostname like local host (www.example.com)
        document.write("HOSTNAME:  " 
                + window.location.hostname + "<br>");
  
        // Prints pathname like /products/find.php
        document.write("PATHNAME:  " 
                + window.location.pathname + "<br>");
  
        // Prints the protocol used like http: or https:
        document.write("PROTOCOL:  " 
                + window.location.protocol + "<br>");
  
        // Prints hostname with port like localhost:3000
        document.write("HOSTNAME WITH PORT:  " 
                + window.location.host + "<br>");
  
        // Prints port number like 3000
        document.write("PORTNUMBER:  " 
                + window.location.port + "<br>");
    

  

输出：

URL IS: https://ide.geeksforgeeks.org/tryit.php
HOSTNAME: ide.geeksforgeeks.org
PATHNAME: /tryit.php
PROTOCOL: https:
HOSTNAME WITH PORT: ide.geeksforgeeks.org
PORTNUMBER:

注意：当您访问特定网站时，它始终连接到一个端口。但是，大多数浏览器不会显示默认端口号。

示例 2：分配或加载新文档。

  

    
        Load another Resource or 
        document from a URL
    
  
    
        function loadPage() {
            window.location.assign(
                "https://ide.geeksforgeeks.org");
        }
    

  

    
        Load Page
    

  
  

输出：

• 点击按钮之前：
  
• 点击按钮后：