location对象属性及查询字符串的处理

Global（全局）对象中的encodeURL()和encodeURIComponent()方法可以对URI进行编码，以便发送给浏览器。有效的URI中不能包含某些字符，比如说空格。而这两个URI编码方法可以对URI进行编码，它们用特殊的UTF-8编码替换所有的无效字符，从而让浏览器可以接收和理解，下面以表格的形式来表达它们的作用和区别：

	encodeURL()	encodeURIComponent()
主要区别	不会对本身属于URI特殊字符进行编码，例如冒号、正斜杠、问号和井字号（“：”、“/”、“？”、“#”.....）	会对它所处理的URI中任何非标准字符字符进行编码
例子	如图
作用	encodeURI()主要用于整个URI的编码	encodeURIComponent()主要用于某个URI片段的编码，如例中的问号之后的片段。Component（译：成分、组件）；
相应的解码方法	decondeURI()	decodeURIComponent()
备注：在实际运用中，常需要对查询字符串进行编码，所以我们运用encodeURIComponent()的情况比较多；

		<script type="text/javascript">
			var uri="https://mp.csdn net/post edit?not_checkout=1";
			document.write(uri+"<br />");
			//https://mp.csdn net/post edit?not_checkout=1
			document.write(encodeURI(uri)+"<br />");
			//https://mp%20csdn%20net/postedit?not_checkout=1
			document.write(encodeURIComponent(uri));
			//https%3A%2F%2Fmp%20csdn%20net%2Fpostedit%3Fnot_checkout%3D1
		</script>

location对象是常用的对象，它提供了与当前窗口中加载的文档的有关信息，还提供了一些导航功能。事实上，location对象既是window对象的属性，也是document对象的属性；换句话说，window.location和doument.location引用的是同一个对象。location保存着当前文档的信息，并且可以将URI解析成独立的片段，通过以下属性可以访问且获得这个片段：

 

属性名	例子	说明	片段名称及作用
hash	"#content"	返回URI中的hash（#号之后的零或多个字符），如果URI中不包含散列，则返回空的字符串；	片段标识符：在URI的末端，通常可标记出以获取资源中的子资源（文档内的某个位置）。为URI中的可选项；
host	"www.wrox.com:80"	返回服务器名称和端口（如果有）；	服务器地址的冒号之后为服务器端口号，服务器地址可以是类似wrox.com这种可解析的域名，或是192.168.1.1这类的IPv4地址名，还可以是[0:0:0:0:0:0:0:1]这样用方括号括起来的IPv6地址名；
hostname	"www.wrox.com"	单独返回服务器名称；	返回不带端口号的服务器名称
href	"https://mp.csdn.net/postedit?not_checkout=1"	返回当前加载页面的完整的URI，location.toString（）方法也可以做到；	完整的URI
pathname （译：路径名）	"/WileyCDA/"	返回URI中的目录和（或）文件名；	带层次的文件路径：指定服务器上的文件路径来定位特指的资源。
port	"8080"	返回URI中指定的端口号。如果URI中不包含端口号，则这个属性返回空字符串；	端口号：指定服务器连接的网络端口号，此项在URI中也是可选部分；若用户省略则自动使用默认端口号；
protocol	"http:"	返回页面使用的协议，通常为http:或https:；	协议方案名：不区分字母大小写，最后跟一个冒号；也可以使用data：或javascript：这类指定数据或脚本程序的方案名；
search	"?q=javascript"	返回URI的查询字符串。这个字符串以问号开头；	查询字符串：针对已指定的文件路径内的资源，可以使用查询字符串传入任意的参数。此项可选。

虽然通过上面的location对象的属性可以获取URI中的大多数信息，但是获取查询字符串的属性并不方便，因为location.search获取的查询字符串还需要再进行处理才可以使用，所以可以创建这样一个函数来处理；

<script type="text/javascript">
	function getQueryStringArgs(){
		//取得查询字符串,并去掉开头的问号之后的所有字符;
		var qs=(location.search.length>0?location.search.substring(1):""),
		//创建一个用来保存数据的对象；
		args={},
		//如果qs的长度不是0，在&符号处将字符串分割开，化为数组；
		items=qs.length?qs.split("&"):[],
		item=null,
		name=null,
		value=null,
		i=0,
		len=itmes.length;
		
		for(i=0;i<len;i++){
			//遍历items数组，把items数组中的每一项在“=”处分开，化为数组,数组只有两项；
			item=items[i].split("=",2);
			name=decodeURIComponent(item[0]);
                        //查询字符串有可能是被编码过的，所以使用decodeURIComponent处理
			value=decodeURIComponent(item[1]);
			//将不是空值的name值作为属性赋给args，以相应的value为属性值；
			if(name.length){
				args[name]=value;
			}
		}
		return args;
	}
</script>

例

假设本地地址location的uri为https://www.baidu.com/baidu?tn=monline_3_dg&ie=utf-8&wd=CSDN
获取到的查询字符串为  	?tn=monline_3_dg&ie=utf-8&wd=CSDN
去掉问号为	tn=monline_3_dg&ie=utf-8&wd=CSDN
第一次使用split("&")获得数组items	 ["tn=monline_3_dg","ie=utf-8","wd=CSDN"]
每次遍历数组会得到一个元素项数为2的数组item例如： ["tn","monline_3_dg"]....
将第一项item[0]作为名，第二项item[1]作为值，增强arges对象；