如何在JavaScript 中获取域名

 更新时间:2023年06月21日 15:27:41   作者:迹忆客  
本文将讨论如何使用 JavaScript 事件和函数在网页执行期间以编程方式获取域名,本文结合示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧

本文将讨论如何使用 JavaScript 事件和函数在网页执行期间以编程方式获取域名。

域名

我们使用域名从客户端应用程序访问网站或网页。 它是映射到 IP 地址(数字)的文本格式字符串。

用户在 Web 浏览器搜索中键入以调用特定网站的字符串称为域名。 例如,delftstack.com 是 DelftStack 的域名。

例子:

let url = "https://www.jiyik.com/" // jiyik.com is a domain name

假设我们正在开发一个网站或网页。 在某些情况下,我们需要在网站运行期间以编程方式找出并使用当前域名。

在这种情况下,我们可以使用 JavaScript 来处理它。

在 JavaScript 中获取域名

现在,如果我们打开浏览器的控制台并获取对象 window.location.hostname,我们可以看到该页面的主机名是 delftstack.com。

window.location 是 JavaScript 中的一个对象,它可以找到当前页面的 URL 作为字符串,我们可以将浏览器重定向到另一个页面。

属性 window.location.hostname 将返回当前页面的互联网主机名。 如果我们的网页在实时域名托管上,我们可以使用 window.location.hostname 获取 URL。

语法:

let hostname = window.location.hostname

示例:

<!DOCTYPE html>
<html>
<body>
<h1>迹忆客 learnig</h1>
    <h2>JavaScript get domain name example</h2>
<p id="para"></p>
<script>
let result = ''
let removeValue = 'www.'
let domainName = window.location.hostname;
   result = domainName.replace(removeValue,'')
document.getElementById("para").innerHTML =
"Current page hostname is: " + result;
</script>
</body>
</html>

代码解释:

  • 在上面的 HTML 源代码中,我们使用了段落元素标记 <p></p> 并将 Id 分配给该元素。
  • <script> 标签内,我们用 window.location.hostname 声明并初始化了 domainName 变量。 我们将获得字符串形式的完整 URL。
  • 现在,要修剪该字符串以仅查找域,我们已经初始化了变量 removeValue 并分配了 www…
  • 我们在 JavaScript 默认方法 replace() 中使用了该变量来删除 www. 从 URL 并将最终值存储在结果变量中。
  • 最后,在 document.getElementById() 方法的帮助下,我们显示了结果字符串。您可以使用 HTML 扩展名保存上述源代码并查看结果,确保在活动域上托管该 HTML 文档。

使用本地存储的 HTML 文档

如果您没有实时域名托管,您可以使用 window.location.href 在您的系统上找到本地存储网页的路径。 它将返回 HTML 文档的完整路径。

语法:

let pathValue = window.location.href // file:///C:/Users/username/foldername/filename.html

到此这篇关于在 JavaScript 中获取域名的文章就介绍到这了,更多相关js获取域名内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 详解微信小程序实现跑马灯效果(附完整代码)

    详解微信小程序实现跑马灯效果(附完整代码)

    这篇文章主要介绍了微信小程序跑马灯效果,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • javaScript之split与join的区别(详解)

    javaScript之split与join的区别(详解)

    下面小编就为大家带来一篇javaScript之split与join的区别(详解)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-11-11
  • 用js小类库获取浏览器的高度和宽度信息

    用js小类库获取浏览器的高度和宽度信息

    在做项目时碰到了要在页面上显示一个浮动DIV层的效果。本来做的是在页面居中时显示的,但后来经过自己的测试发现,当网页中出现了滚动条之后,那个浮动的DIV却还是在页面的顶部显示的
    2012-01-01
  • ECMAScript6轮播图实践知识总结

    ECMAScript6轮播图实践知识总结

    最近萌生了用ECMAScript6写一个轮播图的想法,以前就知道ECMAScript6,但是一直没有学,现在终于下决心学了,本篇文章会总结在实践中用到的ES6的知识。
    2016-08-08
  • js统计录入文本框中字符的个数并加以限制不超过多少

    js统计录入文本框中字符的个数并加以限制不超过多少

    为了更直观的体现用户在文本框输入文本时能看到自己输入了多少字,并且有些特殊的要求字数不超过多少,本文给出了具体的实现
    2014-05-05
  • 原生JS实现轮播图效果

    原生JS实现轮播图效果

    这篇文章主要为大家详细介绍了原生JS实现轮播图效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-10-10
  • 微信小程序利用canvas 绘制幸运大转盘功能

    微信小程序利用canvas 绘制幸运大转盘功能

    本文通过一段简单的实例代码给大家介绍微信小程序利用canvas 绘制幸运大转盘,代码很简单,感兴趣的朋友跟随脚本之家小编一起看看吧
    2018-07-07
  • layui 地区三级联动 form select 渲染的实例

    layui 地区三级联动 form select 渲染的实例

    今天小编就为大家分享一篇layui 地区三级联动 form select 渲染的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • js中switch语句的学习笔记

    js中switch语句的学习笔记

    在本文里小编给各位分享的是关于js中switch语句的使用方法及学习笔记内容,有兴趣的朋友们可以参考下。
    2020-03-03
  • JavaScript性能优化之提升页面加载速度的七个技巧

    JavaScript性能优化之提升页面加载速度的七个技巧

    在现代Web开发中,性能优化是一个永恒的话题,随着用户对页面加载速度的要求越来越高,JavaScript的性能优化显得尤为重要,最近,我在一个大型电商项目中通过实施7个关键的JavaScript优化技巧,成功将页面加载速度提升了65%,本文将详细分享这些实战经验
    2025-11-11

最新评论