如何在 JavaScript 中提取 URL 的主机名部分?
在本教程中,我们将了解如何在 JavaScript 中提取 URL 的主机名部分。
什么是 URL?
网址的另一个术语是 URL。例如,tutorialpoints.com 是一个基于单词的 URL。IP 地址也可以用作 URL(例如 192.168.2.24)。由于名称比数字更容易记住,因此大多数用户在互联网上搜索时都会提交名称的地址
URL 是 Web 浏览器向 Web 服务器请求特定页面的一种方法。 URL 的语法/格式如下所示。
语法
scheme://prefix.domain:port/path/filename
参数
scheme − 指定 Internet 服务的类型(通常使用 http 或 https)
prefix − 指定域前缀(www 是 http 的默认前缀)
domain − 描述 Internet 域名(例如 .tutorialpoints.com)
port − 指定主机的端口号(80 是 http 的默认端口号)
path − 建立服务器端路径
filename −指定资源或文档的名称
典型的 URL 方案
HTTP - 超文本传输协议
HTTP 用于普通网页。这不是加密协议。
HTTPS - 安全超文本传输协议
HTTPS 用于安全网页。这是一个加密协议。
FTP - 文件传输协议
FTP 用于下载或上传文件。
现在让我们看看如何在 URL 中获取主机名。
使用当前窗口位置的 hostname 属性
在本节中,我们将了解如何使用当前窗口位置的 hostname 属性在 URL 中获取主机名
语法
按照以下语法获取主机名。
第一 window.location.hostname;
在这里,我们从当前窗口的位置访问主机名属性。
算法
步骤 1 - 获取当前 URL
步骤 2 - 使用当前窗口位置主机名语法从当前 URL 显示主机名。
示例
在此示例中,我们已设置空 Dom 来显示输出。我们已编写代码以从当前网站位置获取主机名。
<html> <body> <h2>Using the <i>current window location's hostname</i> property</h2> <p id="idNullDom"></p> <p id="idHostDom"></p> <script> var varUrl = window.location.href; var varNullDom = document.getElementById("idNullDom"); varNullDom.innerHTML = "Current url " + varUrl; var varHostDom = document.getElementById("idHostDom"); varHostDom.innerHTML = "Location hostname " + (window.location.hostname); </script> </body> </html>
使用 URL 的 hostname 属性。
在本节中,我们将了解如何使用任何 URL 的 hostname 属性获取 URL 中的主机名。在这里,我们使用 new URL() 构造函数创建了自定义 URL 对象。
语法
按照以下语法获取主机名。
var url = new URL("www.sample.com"); var hostname = url.hostname;
在这里,我们直接从 URL 访问 hostname 属性。我们使用 new URL 方法创建一个新的 URL,然后获取此 url 的 hostname 属性。
示例
在此示例中,代码使用 new URL() 方法创建示例 url。通过访问 URL 本身的 hostname 属性来显示主机名。
<html> <body> <h2>Using the <i>any url's hostname</i> property</h2> <p id="idSampDom"></p> <script> var sampUrl = new URL("https://www.tutorialspoint.com/How-toextract-the-hostname-portion-of-a-URL-in-JavaScript"); var varSampDom = document.getElementById("idSampDom"); varSampDom.innerHTML = "url hostname " + (sampUrl.hostname); </script> </body> </html>
在本教程中,我们学习了如何使用 JavaScript 中的 hostname 属性获取 URL 中的主机名。
hostname 属性是一个内置的 JavaScript 属性,可以从当前 URL 以及使用 new URL() 方法创建的任何 URL 轻松访问主机名。