码迷,mamicode.com
首页 > 编程语言 > 详细

Javascript解析URL

时间:2019-03-13 00:18:14      阅读:666      评论:0      收藏:0      [点我收藏+]

标签:turn   code   asp   形式   source   tps   ret   函数   color   

举个栗子,一个网页的URL为https://i.cnblogs.com/EditPosts.aspx?opt=1,要分离出通信协议、host、port、path、query、hash等值。这时候我们应该怎么做呢?

URL组成

URL : 统一资源定位符 (Uniform Resource Locator, URL)
完整的URL由这几个部分构成:scheme://host:port/path?query#fragment

scheme:通信协议;

host:主机(域名或者IP);

port:端口;

path:路径;

query:传递的参数,可以有多个值(各个值之间用&连起来);

fragment:hash值;

解析函数

   function parseURL(url) {
      let a = document.createElement(‘a‘);
      a.href = url;
      let ret = {};
      // 判断是否有传递参数,若有,则转换成key-value对象形式
      if (a.search) {
        let seg = a.search.replace(‘?‘, ‘‘).split(‘&‘);
        for (let i = 0, len = seg.length; i < len; i++) {
          let key = seg[i].split(‘=‘)[0];
          let value = seg[i].split(‘=‘)[1];
          ret[key] = value;
        }
      }
      return {
        source: url, // 原URL值
        protocol: a.protocol.replace(‘:‘, ‘‘), // 通信协议
        port: a.port, // 端口
        host: a.hostname, // 主机(域名或IP)
        path: a.pathname, // 路径
        query: a.search, // 传递参数
        hash: a.hash.replace(‘#‘, ‘‘), // 哈希值
        param: ret // 传递参数key-value对象
      }
    }

 

Javascript解析URL

标签:turn   code   asp   形式   source   tps   ret   函数   color   

原文地址:https://www.cnblogs.com/qiuxiaozhen/p/10520300.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!