第一种:字符串拆分法

window.location.href 或者 location.href 或者 window.location 获得地址栏中的所有内容

decodeURI()可以解码地址栏中的数据 恢复中文数据

window.search 获得地址栏中问号及问号之后的数据

 //获取地址栏里(URL)传递的参数
function GetRequest(value) {
//url例子:www.bicycle.com?id="123456"&Name="bicycle";
var url = decodeURI(location.search); //?id="123456"&Name="bicycle";
var object = {};
if(url.indexOf("?") != -1)//url中存在问号,也就说有参数。
{
var str = url.substr(1); //得到?后面的字符串
var strs = str.split("&"); //将得到的参数分隔成数组[id="123456",Name="bicycle"];
for(var i = 0; i < strs.length; i ++)
{
        object[strs[i].split("=")[0]]=strs[i].split("=")[1]
      }
  }
return object[value];
}

第二种:正则匹配法

这种方法其实原理和上一种方法类似,都是从URL中提取,只是提取的方法不同而已。

其中   RegExp("(^|&)"    这里的& 指的就是用于隔开参数的 字符,随意改成自己需要的即可

 function GetQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) {
return unescape(r[2]);
}
return null;
}

思维拓展:

有一个select标签

获取地址栏参数,把选中option内容加到地址栏后面

 <!DOCTYPE html>
<html> <head>
<meta charset="utf-8" />
<script src="jquery.min.js"></script>
<script>
function func() {
var vs = $('select option:selected').val();
alert(vs)
}
</script>
</head> <body>
<select onchange="func()">
<option value="1">一月</option>
<option value="2">二月</option>
<option value="3">三月</option>
<option value="4">四月</option>
</select>
</div>
</body> </html>

这一步的目的是获取选中option的值(各位在引用jquery包的之后要记住别忘了再加script标签,  刚写了好几种版本一顿报错。。。。最后发现是标签。。。。。)

在后面就好写了  照着上面获取url参数,自己造一个参数,怼进去就完事了

接下来复习下jquery

首先就是初始化方法 ,我脑子不太灵光,每隔一段时间肯定会忘掉,然后百度搜,记住,在忘掉。。。。

第一种:
$(document).ready(function(){
xxxxxxxxx
}); 第二种:
$(function(){
xxxxxxxxx
}); 第三种:
jQuery(function($){
xxxxxxxxx
});

再就是最基本的选择器

class用"."   id用“#”

jquery极大地提高了编码效率,替代了js中document.getElementByxxx之类的笨重方法

不过在使用jquery的时候要记住不要出现重复的class或者id(除非你是故意的)

还有  一个标签可以定义多个class

就像这样:

 <div class="a b c"></div>

中间用空格隔开。

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

jquery的应用:如何根据一个值来动态让对应的option选中

 $("#select_id option[value='1']").removeAttr("selected"); 根据值去除选中状态

 $("#select_id option[value='"+msg.data.categoryId+"']").attr("selected","selected"); 根据值让option选中

 <select id="select_id" >
<option value="" >请选择</option>
<option value="">苏宁易购</option>
<option value="">天猫旗舰店</option>
<option value="">国美商城</option>
<option value="">华为商城</option>
<option value="">1号店</option>
</select>

写个js/jquery方法:

上来先将获取到的url+“&type=all”

然后选择下拉框内容(all,a,b三个),选完之后将&type=all替换为&type=a这样

然后页面跳转到 &type=a结尾的url

 注意:js中判断是否为空要写作    ===null  或者   !==null     这个我是真的没印象,彻底记住!!!

<script>

var url = window.location.href;
if(getUrlParams("type") == null) {
window.location.href = url + "&type=ALL";
}

$(document).ready(function(){
$(".planChoose").find("option[value ='"+getUrlParams("type")+"']").attr("selected","selected");
});

function getUrlParams(name){
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r!=null)return unescape(r[2]);
return null;
}

$(document).ready(function(){

$('.planChoose').change(function(){
var newurl = url.replace(getUrlParams("type"),$('.planChoose option:selected').val());
window.location.href = newurl;
})
});

</script>

--------------------------------------------------------------------------------------------------------------------------------------

<select class="planChoose" onchange="addPlan()">
<option value="all" >全て</option>
<option value="a">Aプラン</option>
<option value="b">Bプラン</option>
</select>

--------------------------------------------------------------------------------------------------------------------------------------

关于window.location:

var a = window.location.href;     获取当前url

window.location.href="www.xxxxxxxxxxxxxxx.com";    跳转到www.xxxxxxxxxxxxxxx.com

--------------------------------------------------------------------------------------------------------------------------------------

js中replace的用法

replace方法的语法是:stringObj.replace(rgExp, replaceText) 其中stringObj是字符串(string),

reExp可以是正则表达式对象(RegExp)也可以是字符串(string),

replaceText是替代查找到的字符串。

为了帮助大家更好的理解,下面举个简单例子说明一下

<script language="javascript">

var stringObj="终古人民共和国,终古人民";

//替换错别字“终古”为“中国”

//并返回替换后的新字符

//原字符串stringObj的值没有改变

var newstr=stringObj.replace("终古","中国");

alert(newstr);

</script>

前端因为有段时间没研究 md退化了!!好气

学就完了!

在就没啥可说的了,md写困了,等有力气了再把我个人用的不太熟练的jquery方法记录下来

那今天就到这里了  下期再见!

JS获取地址栏参数&jquery的更多相关文章

  1. 【功能代码】---4用JS获取地址栏参数方法

    用JS获取地址栏参数方法 // 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用又方便!) function GetQueryString(name) { var reg = new Reg ...

  2. (转)用JS获取地址栏参数的方法(超级简单)

    转自http://www.cnblogs.com/fishtreeyu/archive/2011/02/27/1966178.html 用JS获取地址栏参数的方法(超级简单) 方法一:采用正则表达式获 ...

  3. 【JS】---4用JS获取地址栏参数方法

    用JS获取地址栏参数方法 // 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用又方便!) function GetQueryString(name) { var reg = new Reg ...

  4. 用JS获取地址栏参数的方法

    采用正则表达式获取地址栏参数: function GetQueryString(name) {      var reg = new RegExp("(^|&)"+ nam ...

  5. 用JS获取地址栏参数的方法(超级简单)

    方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用又方便!) function GetQueryString(name) {      var reg = new RegExp("( ...

  6. JS获取地址栏参数

    获取地址栏参数(其中name为你所需要的参数值) function GetQueryString(name) { var reg = new RegExp("(^|&)" ...

  7. JS 获取 地址栏 参数

    法一:正则表达式 /** * 采用正则表达式获取地址栏参数: **/ var GetQueryString = function (name) { var reg = new RegExp(" ...

  8. 转:用JS获取地址栏参数的方法(超级简单)

    转载链接: http://www.cnblogs.com/fishtreeyu/archive/2011/02/27/1966178.html 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实 ...

  9. [转]用JS获取地址栏参数的方法(超级简单)

    本文转自:http://www.cnblogs.com/fishtreeyu/archive/2011/02/27/1966178.html 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用 ...

随机推荐

  1. js判断图片是否加载完毕

    附件: https://www.jb51.net/article/102385.htm 问题:  .offset().top和$(window).scrollTop()每次刷新页面后滚动的值有时候会不 ...

  2. 栈的实现——java

    和C++一样,JDK包中也提供了"栈"的实现,它就是集合框架中的Stack类.关于Stack类的原理,在"Java 集合系列07之 Stack详细介绍(源码解析)和使用示 ...

  3. windows 安装nexus3

    下载地址 nexus官网下载页面 文件名:nexus-3.3.1-01-win64.zip,解压,cd到bin目录 运行: nexus.exe /run 1 安装成系统服务: nexus.exe /i ...

  4. 【wireshark】插件开发(一):概述

    1. 概述 wireshark提供了灵活的插件机制,使用户可以方便地扩展wireshark的功能.插件的功能主要包括,但不限于协议解析器. 可以使用Lua或C语言来编写Wireshark插件,下表对比 ...

  5. jmeter插件之自定义场景图(万能场景设计)

    添加扩展插件 自定义线程组:jp@gc - Ultimate Thread Group 此线程组功能强大,可以实现多种场景设置,添加路径如图 参数含义解释 Start Threads Count:当前 ...

  6. iOS-UIView一些坐标和位置方法封装

    新建基于UIView扩展类 UIView+wkjFrame,此类是为了方便获取一些基于UIView类UI控件的坐标和位置的简化,直接引用即可 UIView+wkjFrame.h - (CGPoint) ...

  7. php 对象 调用静态方法

    1.BNF范式 .u.op.opline_num = , &$ TSRMLS_CC); } function_call_parameter_list .u.op.opline_num?NULL ...

  8. 【jxoi2018】游戏 组合数学

    首先令$n=r-l+1$. 令$k$表示区间$[l,r]$中存在多少个数$x$,使得$x$不存在小于$x$且在区间$[l,r]$中的因数,我们把包含这些数的数集称为$S$ 我们来先想一个$O(nk)$ ...

  9. ActiveMQ HelloWorld入门

    在P2P的消息模型中,双方通过队列交流,一个队列只有一个生产者和一个消费者.a.消息生产者 package com.ljq.durian.test.activemq; import javax.jms ...

  10. MySQL查询时区分大小写

    在创建MySQL数据库时,下面这些参数可供我们选择:*_bin: 表示的是binary case sensitive collation,也就是说是区分大小写的 *_cs: case sensitiv ...