很久以前写的一个js关于url的帮助类,今天又翻出来了。贴一下源码,做一个简单的教程。
  

作用

  这是一个关于urlquery的一个帮助类,我们在前端编程的时候经常涉及到操作并重组url的情况,在参数比较多的时候操作就比较复杂了。这时候你需要一个帮助类来设置,读取,重组url.

源码

var UrlHelper = function (href) {
var url = href.toLowerCase();
var mark = url.indexOf("?");
if (mark < 0) {
this.host = url;
return this;
}
this.host = url.substring(0, mark);
var paramstr = url.substring(mark + 1);
var submark = paramstr.indexOf("?");
if (submark >= 0) {
var hold = paramstr.substring(submark + 1);
paramstr = paramstr.substring(0, submark);
}
var paramPairs = paramstr.split("&");
var len = paramPairs.length;
var temp;
for (var i = len - 1; i--; ) {
temp = paramPairs[i].split("=");
this.paramSet[temp[0]] = temp[1];
}
temp = paramPairs[len - 1].split("=");
if (submark >= 0) {
var k = {};
this.holdMark = temp[0];
k[temp[0]] = temp[1] + "?" + hold;
this.holdKeyPair = k;
} else this.paramSet[temp[0]] = temp[1];
};
UrlHelper.prototype = {
host: "",
paramSet: { },
holdKeyPair: null,
holdMark: "",
param: function(key) {
if (this.holdMark === key) return this.holdKeyPair[key];
return this.paramSet[key];
},
setParam: function(key, value) {
if (this.holdMark === key) this.holdKeyPair[key] = value;
else this.paramSet[key] = value;
return this;
},
getUrl: function() {
var index = 0;
var str = "";
var copy = this.paramSet;
for (var items in copy) {
str += (items + "=" + copy[items] + "&");
index++;
}
var temp = this.holdMark;
if (temp !== "") {
str += (temp + "=" + this.holdKeyPair[temp] + "&");
index++;
}
if (index) {
str = str.substring(0, str.length - 1);
return this.host + "?" + str;
}
return this.host;
},
removeParam: function(key) {
if (this.holdMark === key) {
this.holdMark = "";
this.holdKeyPair = null;
return this;
}
if (this.paramSet[key]) {
var k = { };
var temp = this.paramSet;
for (var items in temp) {
if (items !== key) k[items] = temp[items];
}
this.paramSet = k;
}
return this;
}
};

实例化

// href ==> http://www.cnblogs.com/licous/admin/EditPosts.aspx?opt=1
var myurlhelper=new UrlHelper(location.href);

  实例化需要一个初始地址,一般是location.href.之所以这样设计是因为可能出现不使用该地址的情况。

使用方法

//href==>http://www.cnblogs.com/licous/admin/EditPosts.aspx?opt=1
/*
*获取参数*/
var opt=myurlhelper.param("opt");
//opt==> 1
/*
*设置一个新参数*/
myurlhelper.setParam("opt1",2);
/*
*更改一个参数的值*/
myurlhelper.setParam("opt",3);
/*
*移除一个参数*/
myurlhelper.removeParam("opt");

注意:以上操作都不会实时改变url,所有的这些操作都保存在内存当中,通过以下方法可以获取最终的url

var targerurl=myurlhelper.getUrl();
//targerurl==>http://www.cnblogs.com/licous/admin/EditPosts.aspx?opt1=2

Javascript-URL帮助类的更多相关文章

  1. javascript常用工具类整理(copy)

    JavaScript常用工具类 类型 日期 数组 字符串 数字 网络请求 节点 存储 其他 1.类型 isString (o) { //是否字符串 return Object.prototype.to ...

  2. 玩转JavaScript OOP[2]——类的实现

    概述 当我们在谈论面向对象编程时,我们在谈论什么?我们首先谈论的是一些概念:对象.类.封装.继承.多态.对象和类是面向对象的基础,封装.继承和多态是面向对象编程的三大特性. JavaScript提供了 ...

  3. javascript URL实现简易书签

    简介 在HTML中,我们可以将js嵌入到script标签中,可以嵌入到行内代码中,也可以嵌入到src(href)中. 后者称作javascript URL.该方式的URL格式固定:javascript ...

  4. javascript基础知识-类和模块

    在JavaScript中可以定义对象的类,让每个对象都共享这些属性. 在JavaScript中,类的实现是基于其原型继承机制的.如果两个实例都从同一个原型对象上继承了属性,我们就说它们是同一个类的实例 ...

  5. JavaScript 数据验证类

    JavaScript 数据验证类 /* JavaScript:验证类 author:杨波 date:20160323 1.用户名验证 2.密码验证 3.重复密码验证 4.邮箱验证 5.手机号验证 6. ...

  6. javascript继承(一)—类的属性研究

    本篇文章主要针对javascript的属性进行分析,由于javascript是一种基于对象的语言,本身没有类的概念,所以对于javascript的类的定义有很多名字,例于原型对象,构造函数等,它们都是 ...

  7. JavaScript中创建类,赋值给ajax中的data参数

    缘由:因为要给根据是否选中checkbox来动态增加ajax中data的属性(ajax的data属性格式的几种方法,参考http://www.jb51.net/article/46676.htm) d ...

  8. Javascript学习6 - 类、对象、继承

    原文:Javascript学习6 - 类.对象.继承 Javasciprt并不像C++一样支持真正的类,也不是用class关键字来定义类.Javascript定义类也是使用function关键字来完成 ...

  9. JavaScript时间工具类

    /** * JavaScript日期工具类 * @author ZhangLp */ /** * 获取当前月的第一天 */ function getCurrentMonthFirst(){ var d ...

  10. JavaScript URL传值过程中遇到的问题及知识点总结

    JavaScript URL传值过程中遇到的问题及知识点总结 Web系统开发过程中经常用到URL进行传值,刚刚接触时不太会解析,会出现中文乱码问题等. 1.父子页面之间的传值(在一个页面中以加载ifr ...

随机推荐

  1. js从服务器下载文件

    通常,将文件绝对路径url作为超链接<a>的链接地址href的值,点击<a>后,浏览器将会尝试请求文件资源,如果浏览器能够辨认文件类型,则将会以预设的打开方式直接打开下载的文件 ...

  2. 第二章 git 工作区与reset,revert

    1.Git工作区原理图 要清楚理解git reset的三个模式的区别,首先应该搞明白Git的各个工作区的划分. 工作区(working directory):在当前仓库中,新增,更改,删除文件这些动作 ...

  3. linux 怎么完全卸载mysql数据库

    在linux下开发,mysql数据库是经常用到的,对于初学者来说,在linux怎么安装卸载mysql数据库,也许可能比较痛苦,这里简单介绍下,怎么卸载msql数据库. a)查看系统中是否以rpm包安装 ...

  4. 调整Win7中TCP/IP半开连接数限制

    调整Win7中TCP/IP半开连接数限制      相信大家都有过这样的经历,普通的ADSL宽带下,打开下载工具下载资源时,再想浏览网页就会变得非常困难了,Windows7中也未能幸免.   究其原因 ...

  5. final

    final的变量的值不能被改变.(包括形参) final的方法不能被重写. final的类不能被继承.

  6. Beyond Compare 2

    Beyond Compare 2 确实很好用,差异行不交叉,自动留出空白,比windiff要清楚.

  7. php二维数组按照键值排序的方法

    //按照传入数组中的num倒序 public function numdesc($array,$key="num",$order="desc"){ $arr_n ...

  8. ZOJ3792_Romantic Value

    给出图,使得两点无流量,剩余其他边的总容量与删除边数的比值. 要机智啊... 因为原图给的边数不超过1000,容量也不超过1000,可以这样把边的容量变为2000*c+1.这样跑出最大流后,最大流除以 ...

  9. max min 与 min max 的差别

    在求解最优化问题时,遇到一个对偶问题的转换:对于形如 的问题,可以转换为求解 即原问题的对偶问题.而在一般情况下: 对于这个为题的说明我参照http://math.stackexchange.com/ ...

  10. Spring overview

    引子 接触Java很多年了,各种framework,却从未系统的去了解过.最近突然想清楚一件事,就是当下的目标——Focus on Java-based RESTful WS & JS.而之于 ...