关于地址栏url的一些小结

BenCHou 发布于2019-08-02 15:59 / 2215人阅读

摘要：获取整个地址栏地址获取整个地址栏地址以上代码就是获取整个地址获取协议部分获取协议部分如果为，则就是获取主机部分获取主机部分带端口号如果为，或者地址为则为如果有端口号，端口号也是要带上的获取主机部分不带端口号地址为则为获取端口号获取端口号地址

1.获取整个地址栏地址

 //获取整个地址栏地址
     var href = window.location.href;
     console.log(href);

以上代码就是获取整个url地址

2.获取url协议部分

 //获取url协议部分
     var protocol = window.location.protocol;
     console.log(protocol);

如果url为http://www.baidu.com，则window.location.protocol就是http:

3.获取主机部分

  //获取主机部分（带端口号）
    var host = window.location.host;
    console.log(host);

如果url为http://www.baidu.com/test.htm...，或者url地址为http://192.1.1.1:1111/test/test.html,则window.location.host为192.1.1.1:1111如果有端口号，端口号也是要带上的

  //获取主机部分（不带端口号）
    var hostname = window.location.hostname;
    console.log(hostname);

url地址为http://192.1.1.1:1111/test/test.html,则hostname为192.1.1.1

4.获取端口号

  //获取端口号
    var port = window.location.port;
    console.log(port);

url地址为http://192.1.1.1:1111/test/test.html,则window.location.port为1111

5.获取url部分路径

//获取部分路径
    var pathname = window.location.pathname;
    console.log(pathname);

url地址为http://192.1.1.1:1111/test/test.html?a=1,则window.location.pathname为/test/test.html，也就是主机部分后面到参数部分前面的就是pathname

6.获取url参数部分

//参数部分
    var search = window.location.search;
    console.log(search);

url地址为http://192.1.1.1:1111/test/test.html?a=1&b=2,则search值为?a=1&b=2

7.获取锚点

  //获取锚点
    var hash = window.location.hash;
    console.log(hash);

url地址为http://192.1.1.1:1111/test/test.html?a=1&b=2#1，则hash为#1

GPU云服务器云服务器地址栏URL IE地址栏的秘密地址栏地址栏语句

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/54449.html

关于地址栏url的一些小结

摘要：获取整个地址栏地址获取整个地址栏地址以上代码就是获取整个地址获取协议部分获取协议部分如果为，则就是获取主机部分获取主机部分带端口号如果为，或者地址为则为如果有端口号，端口号也是要带上的获取主机部分不带端口号地址为则为获取端口号获取端口号地址 1.获取整个地址栏地址 //获取整个地址栏地址 var href = window.location.href; conso...

whidy 2019-08-21 17:50 评论0 收藏0
前端面试题小结

摘要：如何解决不同终端的适配问题弹性盒子，非常不错的选择的运行流程生命周期生命周期优化解释中虚拟存在的好处为什么可以解决跨域问题地址栏输入流程总结初级阶段是会用。前几天也是有人问我的一些问题，我觉得还是挺有了解价值的，也是一些平时开发可能比较会忽略的问题。别的不多说，直接开门见山： 1.post和get的区别？我们都知道GET和POST是HTTP请求的两种基本方法。我相信如果有人问到你这...

fuchenxuan 2019-08-23 15:43 评论0 收藏0
前端面试题小结

摘要：如何解决不同终端的适配问题弹性盒子，非常不错的选择的运行流程生命周期生命周期优化解释中虚拟存在的好处为什么可以解决跨域问题地址栏输入流程总结初级阶段是会用。前几天也是有人问我的一些问题，我觉得还是挺有了解价值的，也是一些平时开发可能比较会忽略的问题。别的不多说，直接开门见山： 1.post和get的区别？我们都知道GET和POST是HTTP请求的两种基本方法。我相信如果有人问到你这...

silenceboy 2019-08-30 15:56 评论0 收藏0
前端面试题小结

摘要：如何解决不同终端的适配问题弹性盒子，非常不错的选择的运行流程生命周期生命周期优化解释中虚拟存在的好处为什么可以解决跨域问题地址栏输入流程总结初级阶段是会用。前几天也是有人问我的一些问题，我觉得还是挺有了解价值的，也是一些平时开发可能比较会忽略的问题。别的不多说，直接开门见山： 1.post和get的区别？我们都知道GET和POST是HTTP请求的两种基本方法。我相信如果有人问到你这...

wangtdgoodluck 2019-08-02 14:27 评论0 收藏0
面试宝典

摘要：有谈谈面试与面试题对于前端面试的一些看法。动态规划算法的思想及实现方法帮大家理清动态规划的解决思路以及原理方法前端经典面试题从输入到页面加载发生了什么这是一篇开发的科普类文章，涉及到优化等多个方面。极客学院前端练习题道练习题，面试季练练手。由数据绑定和排序引入的几个 JavaScript 知识点在 JavaScript 的数据绑定和做简单的表格排序中遇到的几个知识点 [[JS 基础...

neu 2019-08-29 14:00 评论0 收藏0