参考资料

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. IOS中取乱序数据最大值、最小值方法

    2016-01-12 / 23:15:58 第一种方法也是常规方法,就是设定一个默认值作为最大值,循环取比这个最大值还大的值并赋值给默认最大值,这样循环完成后这个默认最大值变量里面的值就是最大值了: ...

  2. js打字机效果实现

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>打 ...

  3. 使用D3绘制图表(2)--绘制曲线

    上一篇是使用D3绘制画布,这一篇的内容是在画布上绘制曲线. 1.之前的html代码没有变化,但是我还是贴出来 <!DOCTYPE html> <html> <head&g ...

  4. Java微信公众号开发-外网映射工具配置

    一.开发环境准备 1.一个微信公众号 2.外网映射工具(开发调试)如花生壳.ngrok工具 注:与微信对接的URL要具备以下条件a:在公网上能够访问 b:端口只支持80端口 这里使用ngrok.cc: ...

  5. ubuntu eclipse 不能新建javaweb项目解决方案

    ubuntu下,通过sudo apt-get install eclipse 成功安装了eclipse,可它简洁的都让我不知如何新建web project.网上查了众多资料,终于找到了一系列简洁的方法 ...

  6. Django- 1- 数据库设置

    更改配置文件中的 字段更改为 DATABASES = { 'default': { 'ENGINE': 'django.db.backends.mysql', //按照自己的数据库配置配置,现在所配置 ...

  7. Freemarker 各种格式化

    1.格式化日期 ${updated?string("yyyy-MM-dd HH:mm:ss")} 如果指定的变量不一定存在,可以这样: ${(dateMap.beginTime?s ...

  8. JAVA中AJAX的使用

    AJAX<%@ page language="java" import="java.util.*" pageEncoding="UTF-8&qu ...

  9. Python中remove,del和pop的区别

    以a=[1,2,3] 为例,似乎使用del, remove, pop一个元素2 之后 a都是为 [1,3], 如下:http://Novell.Me >>> a=[1,2,3] &g ...

  10. [转]git在eclipse中的配置

    一_安装EGIT插件 http://download.eclipse.org/egit/updates/ 或者使用Eclipse Marketplace,搜索EGit 二_使用EGIT前的配置 配置个 ...