JS来动态的修改url实现对url的增删查改


Posted in Javascript onSeptember 05, 2014

虽然可以通过get方式提交post表单等方式来动态修改url,但如果多个按钮能并行提交时,写多个大体相同,又有些细节差异的表单,难免有些不妥,因此,想到了通过JS来动态的修改url,来实现对url的增删查改。

<script>

var LG=(function(lg){
var objURL=function(url){
this.ourl=url||window.location.href;
this.href="";//?前面部分
this.params={};//url参数对象
this.jing="";//#及后面部分
this.init();
}
//分析url,得到?前面存入this.href,参数解析为this.params对象,#号及后面存入this.jing
objURL.prototype.init=function(){
var str=this.ourl;
var index=str.indexOf("#");
if(index>0){
this.jing=str.substr(index);
str=str.substring(0,index);
}
index=str.indexOf("?");
if(index>0){
this.href=str.substring(0,index);
str=str.substr(index+1);
var parts=str.split("&");
for(var i=0;i<parts.length;i++){
var kv=parts[i].split("=");
this.params[kv[0]]=kv[1];
}
}
else{
this.href=this.ourl;
this.params={};
}
}
//只是修改this.params
objURL.prototype.set=function(key,val){
this.params[key]=val;
}
//只是设置this.params
objURL.prototype.remove=function(key){
this.params[key]=undefined;
}
//根据三部分组成操作后的url
objURL.prototype.url=function(){
var strurl=this.href;
var objps=[];//这里用数组组织,再做join操作
for(var k in this.params){
if(this.params[k]){
objps.push(k+"="+this.params[k]);
}
}
if(objps.length>0){
strurl+="?"+objps.join("&");
}
if(this.jing.length>0){
strurl+=this.jing;
}
return strurl;
}
//得到参数值
objURL.prototype.get=function(key){
return this.params[key];
} 
lg.URL=objURL;
return lg;
}(LG||{}));


var myurl=new LG.URL(window.location.href);
myurl.remove("b"); //删除了b
alert(myurl.get ("a"));//取参数a的值,这里得到1
myurl.set("a",23); //修改a的值为23
alert (myurl.url());
</script>
Javascript 相关文章推荐
jquery复选框checkbox实现删除前判断
Apr 20 Javascript
js调试系列 源码定位与调试[基础篇]
Jun 18 Javascript
DOM节点的替换或修改函数replaceChild()用法实例
Jan 12 Javascript
jQuery选择器querySelector的使用指南
Jan 23 Javascript
js与jquery正则验证电子邮箱、手机号、邮政编码的方法
Jul 04 Javascript
AngularJS入门教程之多视图切换用法示例
Nov 02 Javascript
bootstrap按钮插件(Button)使用方法解析
Jan 13 Javascript
Angular中支持SCSS的方法
Nov 18 Javascript
vue里的data要用return返回的原因浅析
May 28 Javascript
JS实现随机抽取三人
Nov 06 Javascript
详解Vue的mixin策略
Nov 19 Vue.js
JavaScript 中for/of,for/in 的详细介绍
Nov 17 Javascript
jQuery表格插件datatables用法总结
Sep 05 #Javascript
jQuery中index()的用法分析
Sep 05 #Javascript
使用jquery解析XML的方法
Sep 05 #Javascript
JavaScript避免内存泄露及内存管理技巧
Sep 05 #Javascript
javascript获取dom的下一个节点方法
Sep 05 #Javascript
原生JavaScript生成GUID的实现示例
Sep 05 #Javascript
javascript动态控制服务器控件实例
Sep 05 #Javascript
You might like
jQuery中的RadioButton,input,CheckBox取值赋值实现代码
2014/02/18 PHP
js png图片(有含有透明)在IE6中为什么不透明了
2010/02/07 Javascript
再谈javascript图片预加载技术(详细演示)
2011/03/12 Javascript
js 判断一个元素是否在页面中存在
2012/12/27 Javascript
被遗忘的javascript的slice() 方法
2015/04/20 Javascript
无需 Flash 使用 jQuery 复制文字到剪贴板
2016/04/26 Javascript
js+html制作简单验证码
2017/02/16 Javascript
Vue服务端渲染和Vue浏览器端渲染的性能对比(实例PK )
2017/03/31 Javascript
php main 与 iframe 相互通讯类(js+php同域/跨域)
2017/09/14 Javascript
微信小程序支付之c#后台实现方法
2017/10/19 Javascript
vue2 v-model/v-text 中使用过滤器的方法示例
2019/05/09 Javascript
atom-design(Vue.js移动端组件库)手势组件使用教程
2019/05/16 Javascript
node+vue实现文件上传功能
2020/05/28 Javascript
在Uni中使用Vue的EventBus总线机制操作
2020/07/31 Javascript
使用vant的地域控件追加全部选项
2020/11/03 Javascript
python网络编程学习笔记(六):Web客户端访问
2014/06/09 Python
python删除某个字符
2018/03/19 Python
Django 使用Ajax进行前后台交互的示例讲解
2018/05/28 Python
Python二元赋值实用技巧解析
2019/10/25 Python
python 如何区分return和yield
2020/09/22 Python
Python在线和离线安装第三方库的方法
2020/10/31 Python
全网最细 Python 格式化输出用法讲解(推荐)
2021/01/18 Python
个人简历自我评价范文
2014/02/04 职场文书
2014信息公开实施方案
2014/02/22 职场文书
酒店节能降耗方案
2014/05/08 职场文书
2015年安全生产责任书
2015/01/30 职场文书
超市督导岗位职责
2015/04/10 职场文书
2015年小学数学教师工作总结
2015/05/20 职场文书
高中生社会实践心得体会
2016/01/14 职场文书
2016年社区创先争优活动总结
2016/04/05 职场文书
Python机器学习之基础概述
2021/05/19 Python
Mysql数据库值的添加、修改、删除及清空操作实例
2021/06/20 MySQL
mysql left join快速转inner join的过程
2021/06/30 MySQL
Vue3中toRef与toRefs的区别
2022/03/24 Vue.js
《LOL》“克隆大作战”久违归来 幻灵战队皮肤上线
2022/04/03 其他游戏
MongoDB误操作后使用oplog恢复数据
2022/04/11 MongoDB