参考资料

http://www.cnblogs.com/Wayou/p/things_you_dont_know_about_frontend.html

很多时候我们有从一个URL中提取域名,查询关键字,变量参数值等的需要,可以通过正则自己解析,但比较麻烦,我们可以让浏览器帮我们完成这一任务。

方法

方法就是在JS代码里先创建一个a标签然后将需要解析的URL赋值给a的href属性,然后就得到了一切我们想要的了。

var a = document.createElement('a');
a.href = 'http://www.cnblogs.com/wayou/p/';
console.log(a.host);

扩展

利用上述方法,可以实现一个更健壮的URL解析方法

function parseURL(url) {
var a = document.createElement('a');
a.href = url;
return {
source: url,
protocol: a.protocol.replace(':',''),
host: a.hostname,
port: a.port,
query: a.search,
params: (function(){
var ret = {},
seg = a.search.replace(/^\?/,'').split('&'),
len = seg.length, i = 0, s;
for (;i<len;i++) {
if (!seg[i]) { continue; }
s = seg[i].split('=');
ret[s[0]] = s[1];
}
return ret;
})(),
file: (a.pathname.match(/\/([^\/?#]+)$/i) || [,''])[1],
hash: a.hash.replace('#',''),
path: a.pathname.replace(/^([^\/])/,'/$1'),
relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [,''])[1],
segments: a.pathname.replace(/^\//,'').split('/')
};
}

利用a标签解析URL的更多相关文章

  1. [前端]利用a标签获取url里所需的内容

    function parseURL(url) { var a = document.createElement('a'); a.href = url; return { source: url, pr ...

  2. a标签解析url

    var url = 'http://127.0.0.1:8080/index.jsp?username=admin#name'; var aLink = document.createElement( ...

  3. Javascript 利用a标签自动解析URL分析网址实例

    /* * @function: 通过a标签解析url标签 * @param:url url参数是字符串,解析的目标 通过IE6-9 chrome Firefox测试 * */ function par ...

  4. 利用 a 标签自动解析 url

    很多时候,我们有从 url 中提取域名,查询关键字,变量参数值等的需求,然而我们可以让浏览器方便地帮助我们完成这一任务而不用写正则去抓取.方法就是先创建一个 a 标签然后将需要解析的 url 赋值给  ...

  5. 【javascript】利用 a 标签自动解析 url

    很多时候,我们有从 url 中提取域名,查询关键字,变量参数值等的需求,然而我们可以让浏览器方便地帮助我们完成这一任务而不用写正则去抓取.方法就是先创建一个 a 标签然后将需要解析的 url 赋值给  ...

  6. IOS开发---菜鸟学习之路--(二十一)-利用正则表达式解析URL获取其中的参数

    因为项目需要解析URL当中参数的部分,在网上搜索了一下都没有相关的资料. 然后就自己写了一个 其实我就是通过正则表达式来处理URL 进行解析的 好了直接上代码吧 也是非常的简单,大家拷贝过去就可以使用 ...

  7. (数据科学学习手札145)在Python中利用yarl轻松操作url

    本文示例代码已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 大家好我是费老师,在诸如网络爬虫.web应用开发 ...

  8. struts2 标签 --<<s:url >

    Struts2中的链接标签 <s:url>和<s:a> 普通链接 Web程序中最普通的应用是链接到其他页面,下面看Welcome.jsp. <%@ page conten ...

  9. 利用strut2标签自动生成form前端验证代码

    利用strut2标签自动生成form前端验证代码,使用到的技术有1.struts2标签,如<s:form> <s:textfieled>2.struts2读取*Validati ...

随机推荐

  1. Smarty单模板多缓存

    Smarty单模板多缓存 单模板多缓存 在生成缓存.判断缓存是否存在时,增加第二个参数,会根据第二个参数来确定对应的缓存文件 清除缓存

  2. SQL Server数据库转换成oracle

    来源:http://blog.csdn.net/hzfu007/article/details/6182151 经常碰到需要把sql server的数据迁移到Oracle的情况. 在网上查找一下,有很 ...

  3. android file path

    问题 出现的异常为:java.lang.IllegalArgumentException: File /mnt/sdcard/crazyit.bin contains a pathseparator. ...

  4. 【CodeVS 1993】草地排水 isap模板题

    开始网络流的学习,更新一下isap的模板 #include<cstdio> #include<cstring> #include<algorithm> #defin ...

  5. Spring Security3学习实例

    Spring Security是什么? Spring Security,这是一种基于Spring AOP和Servlet过滤器的安全框架.它提供全面的安全性解决方案,同时在Web请求级和方法调用级处理 ...

  6. 关于IOS时间日历的一些注意事项 NSDateFormatter

    1.时间或者日期格式化的格式化,在真机上运行的是hi,必须指定是在哪个区域的,不然在真机无法显示 // 1.日期格式化 NSDateFormatter *fmt = [[NSDateFormatter ...

  7. 华硕笔记本之secure boot

    在ubuntu下安装cuda的时候,一直装不好,cuda-7.5.run已经装好了,但是编译cuda的例程时失败,提示cuda的库链接不上. 初步判断是secure boot的问题,因为在开启X的情况 ...

  8. php发送http put/patch/delete请求

    今天学RESTful API的编写,发现不知道怎么发送HTTP PUT/PATCH/DELETE请求,还是要学习一个. 使用curl_opt函数来发送各式各样的http请求动作,不仅限于get和pos ...

  9. 【poj1741】 Tree

    http://poj.org/problem?id=1741 (题目链接) 题意 给出一个n个节点的带权树,求树上距离不超过K的所有点对的个数. solution  点分治裸题.所谓的点分治,就是对于 ...

  10. webapi获取IP的方式

    using System.Net.Http; public static class HttpRequestMessageExtensions { private const string HttpC ...