JS 快速解析 URL 作者: Chuwen 时间: 2019-03-10 分类: JavaScript 评论 > ## 这篇文章会告诉如何用JS快速的解析一个URL，得到协议(protocol)、域名(host)、端口(port)、查询字符串(query)等信息。 # 使用 `<a>` 元素或 `URL` 对象快速解析： ``` function parseURL(url) { var a = document.createElement('a'); a.href = url; // var a = new URL(url); return { source: url, protocol: a.protocol.replace(':', ''), host: a.hostname, port: a.port, query: a.search, params: (function() { var params = {}, seg = a.search.replace(/^\?/, '').split('&'), len = seg.length, p; for (var i = 0; i < len; i++) { if (seg[i]) { p = seg[i].split('='); params[p[0]] = p[1]; } } return params; })(), hash: a.hash.replace('#', ''), path: a.pathname.replace(/^([^\/])/, '/$1') }; } console.log(parseURL('https://test.com:8080/path/index.html?name=angle&age=18#top')); ``` 转载自：http://ghmagical.com/article/page/id/SgIVenH42dyN
点击刷新验证码 / 点击图片刷新图片 作者: Chuwen 时间: 2019-01-17 分类: JavaScript 评论 # 使用 JavaScript 的伪类实现： ```javascript <img title="点击可刷新验证码" src="/index.php" onclick="this.src='/index.php?t='+Math.random()"/> ```
JavaScript 获取地址栏 URL 相关信息汇总 作者: Chuwen 时间: 2018-11-15 分类: JavaScript 评论 # 下面以这个 URL 为例： > ### `https://nowtime.cc/index.php?user=admin&passwd=admin` ## 1. `window.location.href` 获取整个 URL 为字符串 ``` $href = window.location.href; console.log($href);//控制台 输出 https://nowtime.cc/index.php?user=admin&passwd=admin alert($href);//返回 https://nowtime.cc/index.php?user=admin&passwd=admin ``` ## 2. `window.location.protocol` 获取 URL 的协议部分 ``` $protocol = window.location.protocol; console.log($protocol );//控制台 输出 https: alert($protocol );//返回 https: ```` ## 3. `window.location.host` 获取 URL 的主机名部分 ``` $host = window.location.host; console.log($host);//控制台 输出 nowtime.cc alert($host);//返回 nowtime.cc ``` ## 4. `window.location.port` 取与 URL 关联的端口号码 ``` $port = window.location.port; console.log($port); alert($port); //返回：空字符(如果采用默认的80端口、添加了 :80)，那么返回值并不是默认的80而是空字符) ``` ## 5. `window.location.pathname` 获取与 URL 的路径部分 ``` $pathname = window.location.pathname; console.log($pathname);//控制台 输出 index.php alert($pathname);//返回 index.php ``` ## 6. `window.location.search` 获取 href 属性中跟在问号后面的部分 ``` $search = window.location.search; console.log($search);//控制台 输出 ?user=admin&passwd=admin alert($search);//返回 ?user=admin&passwd=admin ``` ## 7. `window.location.hash` 获取 href 属性中在井号“#”后面的部分 ``` $hash = window.location.hash; console.log($hash); alert($hash); //返回：空字符串，因为 URL 中没有 ```