jquery相关总结-CFANZ编程社区

JQuery使用技巧总结
作者：未知

一、简介

1.1、概述
随着WEB2.0及ajax思想在互联网上的快速发展传播，陆续出现了一些优秀的Js框架，其中比较著名的有Prototype、YUI、jQuery、mootools、Bindows以及国内的JSVM框架等，通过将这些JS框架应用到我们的项目中能够使程序员从设计和书写繁杂的JS应用中解脱出来，将关注点转向功能需求而非实现细节上，从而提高项目的开发速度。
jQuery 是继prototype之后的又一个优秀的javascript框架。它是由 John Resig 于 2006 年初创建的，它有助于简化 JavaScript™ 以及Ajax 编程。有人使用这样的一比喻来比较prototype和jQuery：prototype就像Java，而jQuery就像ruby. 它是一个简洁快速灵活的JavaScript框架，它能让你在你的网页上简单的操作文档、处理事件、实现特效并为Web页面添加Ajax交互。

它具有如下一些特点：
1、代码简练、语义易懂、学习快速、文档丰富。
2、jQuery是一个轻量级的脚本，其代码非常小巧，最新版的JavaScript包只有20K左右。
3、jQuery支持css1-CSS3,以及基本的xPath。
4、jQuery是跨浏览器的，它支持的浏览器包括IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+。
5、可以很容易的为jQuery扩展其他功能。
6、能将JS代码和html代码完全分离，便于代码和维护和修改。
7、插件丰富，除了jQuery本身带有的一些特效外，可以通过插件实现更多功能，如表单验证、tab导航、拖放效果、表格排序、DataGrid，树形菜单、图像特效以及ajax上传等。

jQuery的设计会改变你写JavaScript代码的方式，降低你学习使用JS操作网页的复杂度，提高网页JS开发效率，无论对于js初学者还是资深专家，jQuery都将是您的首选。
jQuery适合于设计师、开发者以及那些还好者，同样适合用于商业开发，可以说jQuery适合任何JavaScript应用的地方，可用于不同的Web应用程序中。
官方站点：http://jquery.com/ 中文站点：http://jquery.org.cn/

1.2、目的
通过学习本文档，能够对jQuery有一个简单的认识了解，清楚JQuery与其他JS框架的不同，掌握jQuery的常用语法、使用技巧及注意事项。

二、使用方法
在需要使用JQuery的页面中引入JQuery的js文件即可。
例如：<script type="text/javascript" src="js/jquery.js"></script>
引入之后便可在页面的任意地方使用jQuery提供的语法。

三、学习教程及参考资料
请参照《jQuery中文API手册》和http://jquery.org.cn/visual/cn/index.xml
推荐两篇不错的jquery教程：《jQuery的起点教程》和《使用 jQuery 简化 Ajax 开发》
(说明：以上文档都放在了【附件】中)

四、语法总结和注意事项

1、关于页面元素的引用
通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法，且返回的对象为jquery对象（集合对象），不能直接调用dom定义的方法。

2、jQuery对象与dom对象的转换
只有jquery对象才能使用jquery定义的方法。注意dom对象和jquery对象是有区别的，调用方法时要注意操作的是dom对象还是jquery对象。
普通的dom对象一般可以通过$()转换成jquery对象。
如：$(document.getElementById("msg"))则为jquery对象，可以使用jquery的方法。
由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项，一般可通过索引取出。
如：$("#msg")[0]，$("div").eq(1)[0]，$("div").get()[1]，$("td")[5]这些都是dom对象，可以使用dom中的方法，但不能再使用Jquery的方法。
以下几种写法都是正确的：

$("#msg").html(); 

$("#msg")[0].innerHTML; 

$("#msg").eq(0)[0].innerHTML; 

$("#msg").get(0).innerHTML;

3、如何获取jQuery集合的某一项
对于获取的元素集合，获取其中的某一项（通过索引指定）可以使用eq或get(n)方法或者索引号获取，要注意，eq返回的是jquery对象，而get (n)和索引返回的是dom元素对象。对于jquery对象只能使用jquery的方法，而dom对象只能使用dom的方法，如要获取第三个< div>元素的内容。有如下两种方法：

$("div").eq(2).html(); //调用jquery对象的方法 

$("div").get(2).innerHTML; //调用dom的方法属性

4、同一函数实现set和get
Jquery中的很多方法都是如此，主要包括如下几个：

$("#msg").html(); //返回id为msg的元素节点的html内容。 

$("#msg").html("<b>new content</b>"); 

//将“<b>new content</b>” 作为html串写入id为msg的元素节点内容中,页面显示粗体的new content 


$("#msg").text(); //返回id为msg的元素节点的文本内容。 

$("#msg").text("<b>new content</b>"); 

//将“<b>new content</b>” 作为普通文本串写入id为msg的元素节点内容中,页面显示粗体的<b>new content</b> 


$("#msg").height(); //返回id为msg的元素的高度 

$("#msg").height("300"); //将id为msg的元素的高度设为300 

$("#msg").width(); //返回id为msg的元素的宽度 

$("#msg").width("300"); //将id为msg的元素的宽度设为300 


$("input").val("); //返回表单输入框的value值 

$("input").val("test"); //将表单输入框的value值设为test 


$("#msg").click(); //触发id为msg的元素的单击事件 

$("#msg").click(fn); //为id为msg的元素单击事件添加函数 

同样blur,focus,select,submit事件都可以有着两种调用方法

5、集合处理功能
对于jquery返回的集合内容无需我们自己循环遍历并对每个对象分别做处理，jquery已经为我们提供的很方便的方法进行集合的处理。
包括两种形式：

$("p").each(function(i){this.style.color=['#f00','#0f0','#00f']}) 

//为索引分别为0，1，2的p元素分别设定不同的字体颜色。 


$("tr").each(function(i){this.style.backgroundColor=['#ccc','#fff'][i%2]}) 

//实现表格的隔行换色效果 


$("p").click(function(){.html())}) 

//为每个p元素增加了click事件，单击某个p元素则弹出其内容

6、扩展我们需要的功能

$.extend({ 

 min: function(a, b){return a < b?a:b; }, 

 max: function(a, b){return a > b?a:b; } 

}); //为jquery扩展了min,max两个方法 

使用扩展的方法（通过“$.方法名”调用）： 

+",min="+$.min(10,20));

7、支持方法的连写
所谓连写，即可以对一个jquery对象连续调用各种不同的方法。
例如：

$("p").click(function(){.html())}) 

.mouseover(function(){}) 

.each(function(i){this.style.color=['#f00','#0f0','#00f']});

8、操作元素的样式
主要包括以下几种方式：

$("#msg").css("background"); //返回元素的背景颜色 

$("#msg").css("background","#ccc") //设定元素背景为灰色 

$("#msg").height(300); $("#msg").width("200"); //设定宽高 

$("#msg").css({ color: "red", background: "blue" });//以名值对的形式设定样式 

$("#msg").addClass("select"); //为元素增加名称为select的class 

$("#msg").removeClass("select"); //删除元素名称为select的class 

$("#msg").toggleClass("select"); //如果存在（不存在）就删除（添加）名称为select的class

JQUERY使用技巧~总结

1. 禁止右键点击

1. $(document).ready(function(){ 

2. $(document).bind("contextmenu",function(e){ 

3. return false; 

4. }); 

5. });

2. 隐藏搜索文本框文字

1. $(document).ready(function() { 

2. $("input.text1").val("Enter your search text here"); 

3. textFill($('input.text1')); 

4. }); 

5. 

6. function textFill(input){ //input focus text function 

7. var originalvalue = input.val(); 

8. input.focus( function(){ 

9. if( $.trim(input.val()) == originalvalue ){ input.val(''); } 

10. }); 

11. input.blur( function(){ 

12. if( $.trim(input.val()) == '' ){ input.val(originalvalue); } 

13. }); 

14. }

3. 在新窗口中打开链接

1. $(document).ready(function() { 

2. //Example 1: Every link will open in a new window 

3. $('a[href^="http://"]').attr("target", "_blank"); 

4. 

5. //Example 2: Links with the rel="external" attribute will only open in a new window 

6. $('a[@rel$='external']').click(function(){ 

7. this.target = "_blank"; 

8. }); 

9. }); 

10. // how to use 

11. <A href="http://www.opensourcehunter.com" rel=external>open link</A> 4. 检测浏览器 

注: 在版本jQuery 1.4中，$.support 替换掉了$.browser 变量。 

view plaincopy to clipboardprint? 

1. $(document).ready(function() { 

2. // Target Firefox 2 and above 

3. if ($.browser.mozilla && $.browser.version >= "1.8" ){ 

4. // do something 

5. } 

6. 

7. // Target Safari 

8. if( $.browser.safari ){ 

9. // do something 

10. } 

11. 

12. // Target Chrome 

13. if( $.browser.chrome){ 

14. // do something 

15. } 

16. 

17. // Target Camino 

18. if( $.browser.camino){ 

19. // do something 

20. } 

21. 

22. // Target Opera 

23. if( $.browser.opera){ 

24. // do something 

25. } 

26. 

27. // Target IE6 and below 

28. if ($.browser.msie && $.browser.version <= 6 ){ 

29. // do something 

30. } 

31. 

32. // Target anything above IE6 

33. if ($.browser.msie && $.browser.version > 6){ 

34. // do something 

35. } 

36. });

5. 预加载图片

1. $(document).ready(function() { 

2. jQuery.preloadImages = function() 

3. { 

4. for(var i = 0; i").attr("src", arguments[i]); 

5. } 

6. }; 

7. // how to use 

8. $.preloadImages("image1.jpg"); 

9. });

6. 页面样式切换

1. $(document).ready(function() { 

2. $("a.Styleswitcher").click(function() { 

3. //swicth the LINK REL attribute with the value in A REL attribute 

4. $('link[rel=stylesheet]').attr('href' , $(this).attr('rel')); 

5. }); 

6. // how to use 

7. // place this in your header 

8. <LINK href="default.css" type=text/css rel=stylesheet> 

9. // the links 

10. <A class="Styleswitcher" href="#" rel=default.css>Default Theme</A> 

11. <A class="Styleswitcher" href="#" rel=red.css>Red Theme</A> 

12. <A class="Styleswitcher" href="#" rel=blue.css>Blue Theme</A> 

13. });

7. 列高度相同
如果使用了两个CSS列，使用此种方式可以是两列的高度相同。

1. $(document).ready(function() { 

2. function equalHeight(group) { 

3. tallest = 0; 

4. group.each(function() { 

5. thisHeight = $(this).height(); 

6. if(thisHeight > tallest) { 

7. tallest = thisHeight; 

8. } 

9. }); 

10. group.height(tallest); 

11. } 

12. // how to use 

13. $(document).ready(function() { 

14. equalHeight($(".left")); 

15. equalHeight($(".right")); 

16. }); 

17. });

8. 动态控制页面字体大小
用户可以改变页面字体大小

1. $(document).ready(function() { 

2. // Reset the font size(back to default) 

3. var originalFontSize = $('html').css('font-size'); 

4. $(".resetFont").click(function(){ 

5. $('html').css('font-size', originalFontSize); 

6. }); 

7. // Increase the font size(bigger font0 

8. $(".increaseFont").click(function(){ 

9. var currentFontSize = $('html').css('font-size'); 

10. var currentFontSizeNum = parseFloat(currentFontSize, 10); 

11. var newFontSize = currentFontSizeNum*1.2; 

12. $('html').css('font-size', newFontSize); 

13. return false; 

14. }); 

15. // Decrease the font size(smaller font) 

16. $(".decreaseFont").click(function(){ 

17. var currentFontSize = $('html').css('font-size'); 

18. var currentFontSizeNum = parseFloat(currentFontSize, 10); 

19. var newFontSize = currentFontSizeNum*0.8; 

20. $('html').css('font-size', newFontSize); 

21. return false; 

22. }); 

23. });

9. 返回页面顶部功能

1. $(document).ready(function() { 

2. $('a[href*=#]').click(function() { 

3. if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') 

4. && location.hostname == this.hostname) { 

5. var $target = $(this.hash); 

6. $target = $target.length && $target 

7. || $('[name=' + this.hash.slice(1) +']'); 

8. if ($target.length) { 

9. var targetOffset = $target.offset().top; 

10. $('html,body') 

11. .animate({scrollTop: targetOffset}, 900); 

12. return false; 

13. } 

14. } 

15. }); 

16. // how to use 

17. // place this where you want to scroll to 

18. <A name=top></A> 

19. // the link 

20. <A href="#top">go to top</A> 

21. });

11.获得鼠标指针ＸＹ值

1. $(document).ready(function() { 

2. $().mousemove(function(e){ 

3. //display the x and y axis values inside the div with the id XY 

4. $('#XY').html("X Axis : " + e.pageX + " | Y Axis " + e.pageY); 

5. }); 

6. // how to use 

7. <DIV id=XY></DIV> 

8. 

9. });

12. 验证元素是否为空

1. $(document).ready(function() { 

2. if ($('#id').html()) { 

3. // do something 

4. } 

5. });

13. 替换元素

1. $(document).ready(function() { 

2. $('#id').replaceWith(' 

3. <DIV>I have been replaced</DIV> 

4. 

5. '); 

6. });

14. jQuery延时加载功能

1. $(document).ready(function() { 

2. window.setTimeout(function() { 

3. // do something 

4. }, 1000); 

5. });

15. 移除单词功能

1. $(document).ready(function() { 

2. var el = $('#id'); 

3. el.html(el.html().replace(/word/ig, "")); 

4. });

16. 验证元素是否存在于Ｊｑｕｅｒｙ对象集合中

1. $(document).ready(function() { 

2. if ($('#id').length) { 

3. // do something 

4. } 

5. });

17. 使整个ＤＩＶ可点击

1. $(document).ready(function() { 

2. $("div").click(function(){ 

3. //get the url from href attribute and launch the url 

4. window.location=$(this).find("a").attr("href"); return false; 

5. }); 

6. // how to use 

7. <DIV><A href="index.html">home</A></DIV> 

8. 

9. });

18.ID与Class之间转换
当改变Window大小时，在ID与Class之间切换

1. $(document).ready(function() { 

2. function checkWindowSize() { 

3. if ( $(window).width() > 1200 ) { 

4. $('body').addClass('large'); 

5. } 

6. else { 

7. $('body').removeClass('large'); 

8. } 

9. } 

10. $(window).resize(checkWindowSize); 

11. });

19. 克隆对象

1. $(document).ready(function() { 

2. var cloned = $('#id').clone(); 

3. // how to use 

4. <DIV id=id></DIV> 

5. 

6. });

20. 使元素居屏幕中间位置

1. $(document).ready(function() { 

2. jQuery.fn.center = function () { 

3. this.css("position","absolute"); 

4. this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px"); 

5. this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px"); 

6. return this; 

7. } 

8. $("#id").center(); 

9. });

21. 写自己的选择器

1. $(document).ready(function() { 

2. $.extend($.expr[':'], { 

3. moreThen1000px: function(a) { 

4. return $(a).width() > 1000; 

5. } 

6. }); 

7. $('.box:moreThen1000px').click(function() { 

8. // creating a simple js alert box 

9. alert('The element that you have clicked is over 1000 pixels wide'); 

10. }); 

11. });

22. 统计元素个数

1. $(document).ready(function() { 

2. $("p").size(); 

3. });

23. 使用自己的 Bullets

1. $(document).ready(function() { 

2. $("ul").addClass("Replaced"); 

3. $("ul > li").prepend("? "); 

4. // how to use 

5. ul.Replaced { list-style : none; } 

6. });

24. 引用Google主机上的Jquery类库
Let Google host the jQuery script for you. This can be done in 2 ways.

1. //Example 1 

2. <SCRIPT src="http://www.google.com/jsapi"></SCRIPT> 

3. <SCRIPT type=text/javascript> 

4. google.load("jquery", "1.2.6"); 

5. google.setOnLoadCallback(function() { 

6. // do something 

7. }); 

8. </SCRIPT><SCRIPT src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type=text/javascript></SCRIPT> 

9. 

10. // Example 2:(the best and fastest way) 

11. <SCRIPT src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type=text/javascript></SCRIPT>

25. 禁用Jquery（动画）效果

1. $(document).ready(function() { 

2. jQuery.fx.off = true; 

3. });

26. 与其他Javascript类库冲突解决方案

1. $(document).ready(function() { 

2. var $jq = jQuery.noConflict(); 

3. $jq('#id').show(); 

4. });

jquery 使用的一些总结收藏
jQuery 对象转成DOM 对象：

var dom=jqueryObj.get(0);

或var domObj=jqueryObj[0];

DOM 对象转成jQuery 对象:

对于已经是一个DOM 对象，只需要用$()把DOM 对象包装起来，就可以获得一个jQuery 对象了。$(DOM 对象)

var jqueryObj=$(domObj);

一个片段

$( function() { 


 var t = $("#t"); 

 var show = $("#showArea"); 


//用ajax 从服务器端传回的xml 格式的数据 

 $.get("AJAXServer", null, function(resp) { 


 var tab = resp.getElementsByTagName("table")[0]; 


 var t2 = tab.cloneElement(); 

 // show.append($(t2)); //将dom 对像转换为jquery 对象后加入document 

 show.get(0).appendChild(t2); // 将jquery 对象转换成dom 对象后 

 }, "xml" 


 ) 


} 


)

============================================================

//str 为xml 格式的字符串,开头可以有<?xml version="1.0" encoding="UTF-8"?>的声明 ，也可以没有F 

function createXMLDOM(str) { 

 var oXmlDom; 

 var arrSignatures = [ "MSXML2.DOMDocument.6.0", "MSXML2.DOMDocument.5.0", 

 "MSXML2.DOMDocument.4.0", "MSXML2.DOMDocument.3.0", 

 "MSXML2.DOMDocument", "MSXML.DOMDocument", "Microsoft.XmlDom" ]; 

 if (window.ActiveXObject) { 

 for ( var i = 0; i < arrSignatures.length; i++) { 

 try { 

 var oXmlDom = new ActiveXObject(arrSignatures[i]); 

 oXmlDom.loadXML(str); 

 // return oXmlDom; 

 break; 

 } catch (oError) { 

 // ignore 

 } 

 } 

 } else { 

 try { 

 var Parser = new DOMParser(); 

 oXmlDom = Parser.parseFromString(str, "text/xml"); 

 } catch (e) { 

 } 

 } 


 if (oXmlDom == null) { 

 // throw new Error("MSXML没有安装"); 

 } 


 return oXmlDom; 

} 


// clone attributes,and the node self ,no child is cloned 

// 进行dom Element节点 的浅层复制 

function cloneSimpleEle(root) { 

 if (root.nodeType == 1) { 

 var root_clone_ = document.createElement(root.tagName); 

 if (root.attributes && root.attributes.length > 0) { 

 var attr_len = root.attributes.length; 

 for ( var j = 0; j < attr_len; j++) { 

 var attr = root.attributes[j]; 

 root_clone_.setAttribute(attr.nodeName, attr.nodeValue); 

 } 

 } 

 return root_clone_; 


 } 


} 

/* 

 * 此函数，用于DOM Element 的复制,返回一个几乎与参数一致的Dom Element 

 * （有一些差别，如忽略了注释等无关紧要的东西，只复制了其中的文本节点和标签，） 另外，传进去的参数不仅可以是html中的DOM 对象，也可以是xml 

 * 中的DOM 对像， 如果您想用此函数进行html 中dom 节点的复制，建议用 系统自带的函数dom.cloneNode(deep_boolean); 

 * 进行深层或浅层的复制，此函数存在 的理由，主要是适用于xml dom对像向html dom对像转化的情形， 例如处理ajax 

 * 返回的xml数据，（直接返回的dom对像没法在html 的document 中进行appendChild() ,insertBefore() 

 * 等操作，经过此函数处理之后的对像则可以） 


*用法 var div=document.getElementById("id1"); 


var div_clone=cloneElement(div); 


有了下面这个函数，则可以简化为 


var div_clone=div.cloneElement(); 


Element.prototype.cloneElement = function() { 


 */ 

function cloneElement(root) { 

 var root_clone = cloneSimpleEle(root); 


 if (root.hasChildNodes()) { 

 var child_len = root.childNodes.length; 

 for ( var i = 0; i < child_len; i++) { 

 var child = root.childNodes[i]; 

 var clone; 

 if (child.nodeType == 3) { 

 clone = document.createTextNode(child.nodeValue); 

 } else if (child.nodeType == 1) { 

 clone = cloneElement(child); 

 } 

 root_clone.appendChild(clone); 

 } 

 } 

 return root_clone; 

} 

Element.prototype.cloneElement = function() { 

 var root_clone = cloneSimpleEle(this); 


 if (this.hasChildNodes()) { 

 var child_len = this.childNodes.length; 

 for ( var i = 0; i < child_len; i++) { 

 var child = this.childNodes[i]; 

 var clone; 

 if (child.nodeType == 3) { 

 clone = document.createTextNode(child.nodeValue); 

 } else if (child.nodeType == 1) { 

 clone = cloneElement(child); 

 } 

 root_clone.appendChild(clone); 

 } 

 } 

 return root_clone; 


} 


// ============================= start of js lib for 

// ajax============================================================================================================================== 

var http_request = false; 

var callback_func; 


// 使用说明 

// 二,在页面使用如下代码将js文件包含进来: 

// <script language=javascript src="ajax.js"></script> 


// 三,在页面调用sendRequest(...)方法: 

// 如:<a href="javascript:sendRequest(param,function,'GET')" >调用AJAX</a> 

// 或:<input type="button" value="提交" 

// οnclick="sendRequest('post.do',param,function,'POST')" /> 

// 注释(以第一个为例): 

// 暂时就不用了 default.do: 这个例子采用ajax通过一个链接请求default.do页面, 

// param: 

// 为参数,可以为空,也可以不为空,比如name=value&password=123456,也可以通过把一个表单(form)的字段组合起来作为一个字符串传递 

// 过去, 

// function: 是你自己写的一个函数,用于处理返回的内容,一般的处理是 

// 将返回的内容显示在页面,一个典型的例子: 

// function search(str){ 

// alert(str); //用于调试. 

// myId.innerHTML = str; 

// } 

// GET: 是请求的方法,简单的说,get代表请求一个资源,post代表提交参数并请求资源. 

// 发送ajax请求 get或post 完全兼容 IE FireFox各个版本,程序在 IE5.0,6.0,7.0,8.0 

// FireeFox2.0,30下均做了全面测试 

function sendRequest(url, argstr, func, method) { 


 http_request = false; 

 callback_func = func; 


 if (window.XMLHttpRequest) { // Mozilla, Safari,... 

 http_request = new XMLHttpRequest(); 

 // if (http_request.overrideMimeType) { 

 // http_request.overrideMimeType('text/xml'); 

 // } 

 } else if (window.ActiveXObject) { // IE 

 try { 

 http_request = new ActiveXObject("Msxml2.XMLHTTP"); 

 } catch (e) { 

 try { 

 http_request = new ActiveXObject("Microsoft.XMLHTTP"); 

 } catch (e) { 

 } 

 } 

 } 


 if (!http_request) { 

 alert('不能建立 XMLHTTP 对象'); 

 return false; 

 } 


 if (method == 'GET') { 

 // http_request.onreadystatechange = alertContents; 

 http_request.open('GET', url + '?' + argstr, false); // 目前是同步 true:异步 

 // false:同步 

 http_request.send(null); 

 alertContents(); 

 } else { 

 // http_request.onreadystatechange = alertContents; 

 http_request.open('POST', url + '', false); 

 http_request.setRequestHeader("Content-Type", 

 "application/x-www-form-urlencoded; charset=utf-8"); 


 http_request.send(argstr); 

 alertContents(); 

 } 

} 


// 延迟处理,超时后的处理 

function alertContents() { 

 if (http_request.readyState == 4) { 

 if (http_request.status == 200 || http_request.status == 0) { 

 callback_func(http_request.responseText); 

 } else { 

 alert('服务端返回状态: ' + http_request.statusText); 

 } 

 } else { 

 // alert('数据加载中...'); 

 } 

} 

// =====================================end of 

// ajax======================================================================== 



//========================================================================================== 


//取出url中的各个参数对应的值 url参数解析 

//如 果url 中并无strParamName ,则返回空字符中“” 


// 如：getURLParam("name", "") 返回111 或无则空串 

function getURLParam(strParamName, url) { 

 var strReturn = ""; 

 var strHref = url.toLowerCase(); 

 if (strHref.indexOf("?") > -1) { 

 var strQueryString = strHref.substr(strHref.indexOf("?") + 1).toLowerCase(); 

 var aQueryString = strQueryString.split("&"); 

 for (var iParam = 0; iParam < aQueryString.length; iParam++) { 

 if (aQueryString[iParam].indexOf(strParamName.toLowerCase() + "=") > -1) { 

 var aParam = aQueryString[iParam].split("="); 

 strReturn = aParam[1]; 

 break; 

 } 

 } 

 } 

 return strReturn; 

}