很久以前写的一个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. CMakeLists for tesseract

    在网上找了很多,直接用都不行,试了半天的到以下的结果. cmake_minimum_required(VERSION 2.8) project( test ) include_directories ...

  2. NC 查询公司下所分配的组织,并存放字符串数组中

    private String[] querkFather() { String sql = "select pk_org from org_orgs start with pk_father ...

  3. java日常时间处理

    private static String[] parsePatterns = { "yyyy-MM-dd", "yyyy-MM-dd HH:mm:ss", & ...

  4. [转]阿里云CentOS配置全过程

     

  5. 硬浮点 VFP

    http://blog.chinaunix.net/uid-27875-id-3449290.html   编译器对VFP的支持一个浮点数操作最后是翻译成VFP指令,还是翻译成fpa,或者是softf ...

  6. Busybox下tftp命令使用详解

    http://blog.chinaunix.net/uid-375398-id-1991686.html Busybox下的tftp命令可以用来进行单文件传输.使用的时候,是把电脑作为服务器Serve ...

  7. Python 第三天 文件操作(2)

    文件操作 操作文件时,一般需要经历如下步骤: 打开文件 操作文件 一.打开 文件句柄 = file('文件路径', '模式') 注:python中打开文件有两种方式,即:open(...) 和  fi ...

  8. JIT动态编译器的原理与实现之Interpreter(解释器)的实现(三)

    接下来,就是要实现一个虚拟机了.记得编码高质量的代码中有一条:不要过早地优化你的代码.所以,也本着循序渐进的原则,我将从实现一个解释器开始,逐步过渡到JIT动态编译器,这样的演化可以使原理看起来更清晰 ...

  9. JS、C#及SQL中的DateTime

    一:SQL中的DataTime 1.       between and 相当于>= and <= 2.       常用的将DataTime查询成字符串的方法 Select CONVER ...

  10. MVC文件上传和下载

    1.单个文件上传 HTML写法:form表单中加enctype="multipart/form-data" <form aciont="" method= ...