在前端开发过程中，经常需要获取当前网站的基础 URL。这个基础 URL 包含了协议、主机名和端口号等信息，是进行一些网络请求和页面跳转等操作的必要条件。本文将介绍在 JavaScript 中如何获取网站的基础 URL，并给出相关示例代码。
使用 window.location 对象获取基础 URL
JavaScript 中提供了一个 window.location 对象，它包含了当前网站的 URL 信息，我们可以从中获取网站的基础 URL。具体来说，我们可以通过以下代码获取基础 URL：
----- ------- - -------------------------------------------------------
在上述代码中，window.location.protocol 表示当前网站的协议，例如 http: 或 https:；window.location.host 则表示当前网站的主机名和端口号，例如 www.example.com:8080。这两者结合起来，就可以构成当前网站的基础 URL。
需要注意的是，由于浏览器的安全限制，JavaScript 并不能直接访问所有的 URL 信息。如果我们尝试获取 window.location.href，则会得到一个包含敏感信息的字符串，因此不推荐使用该属性获取基础 URL。
使用 document.baseURI 属性获取基础 URL
除了 window.location 对象之外，JavaScript 还提供了一个 document.baseURI 属性，可以用于获取当前网页的基础 URL。具体来说，我们可以通过以下代码获取基础 URL：
----- ------- - -----------------
需要注意的是，document.baseURI 属性并不是所有浏览器都支持的，因此在使用该属性时需要进行兼容性检查。
实际应用示例
下面是一个实际应用示例，假设我们有一个按钮，点击后需要跳转到当前网站的首页。我们可以通过以下代码实现该功能：
------- --------------------------------------------
-------- -------------------- - ----- ------- - ------------------------------------------------------- -------------------- - ------------------------ -
在上述代码中，我们先通过 window.location 对象获取基础 URL，然后将其与 /index.html 拼接起来，最终得到完整的首页 URL。接着，我们将该 URL 赋值给 window.location.href 属性，即可实现页面跳转。
总结
本文介绍了在 JavaScript 中获取网站的基础 URL 的方法，其中包括使用 window.location 对象和 document.baseURI 属性两种方式。同时，我们也给出了一个实际应用示例，以帮助读者更好地理解如何使用这些技术。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/30313