在网络上玩儿，就得学会怎么传数据。每次搞定这个，我都特有成就感。今天，我来聊聊我的心得，就是搞懂怎么用GET方式、HTML5的WebStorage还有一些小技巧传变量这几招儿。

一、以GET方式实现页面间参数传递

我最早学的参数传递是用GET方式，简单来说，就是把数据放在URL的?后面。举个例子，你在网页上看到一个带参数的链接，点进去就能在新页面上拿到这些参数。这方法简单好用，对各种浏览器都支持得挺好。但要是有太多参数或涉及敏感信息的话，用GET就显得不妥当，因为它们会直接出现在URL里，容易被人看见，所以我用GET时都会特别注意参数的安全性和数量，尽量避免用户隐私泄露。

二、通过HTML5WebStorage特性实现参数传递

	function getParameterByName(name){
		var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
		return match && decodeURIComponent(match[1].replace(/+/g, ' '));
	}
	$('#page_Parameter1').live('pageshow',  function(event, ui){
		alert("第二个页面的参数：" + getParameterByName('parameter'));
	});



	 

	 	

	 		
页面参数传值
	 	
	 	

	 		
传递参数进入下一页，以Alert方式显示参数内容。

	 传递参数进入下一页

	 		
	 	

	 
	 

	 	

	 		
页面参数传递
	 	
	 	

	 		
通过Alert显示前一个界面参数。
 
	 		返回
	 	

	 

HTML5给我们带来了新的玩意儿——WebStorage，这个东西有两个类型，sessionStorage和localStorage。它们就是把数据存在浏览器里，但用法有点区别：sessionStorage的数据只要会话结束就没了，而要用到持久存储的，得选localStorage。我在做开发的时候，常常用到sessionStorage，因为它正好满足我的需求：没必要持久存储，只用保证在当前会话里数据能找到就行。但是用WebStorage传参的话，得注意浏览器兼容问题，还有数据安全问题，别弄丢了敏感信息。

三、建立当前页面变量进行参数传递

这种方法就是搞点变量，必要时把参数塞进去传到别的页面。虽然简单明了，但实在不咋地灵活，因为得用特定的变量来传递参数。我平时基本不用这个，因为太死板，还得在两页上都设同样的变量，团队合作时很容易出岔子。

四、GET方式的安全性考虑

说到用GET方法传参数，安全性要重视！因为这些参数都会直接显现在网址上，谁都能看得见！所以，为了保护大家的隐私和个人信息不泄露，我是尽量不用GET这种方法来传递像密码、信用卡号这样的重要信息。而且，我会把这些参数加密处理，让它们更难被人发现，降低被坏蛋利用的可能。

五、HTML5WebStorage的兼容性和存储限制

我得操心WebStorage的兼容性。浏览器们对它的支持情况不一样，搞得我得使劲儿测试，保证它在各种浏览器上都能用才行。另外，WebStorage还有限制，不同的浏览器能存多少数据也不一样。要是存多了，那可就要存不上了。所以，用WebStorage时我会想好怎么存数据，免得出问题。

六、变量传递的局限性和改进方法

直传变量虽直接，但没那么灵活。编程时经常碰到要传不同类型和数量的参数，搞得咱头疼。为解决这个问题，我试过引入更自由的数据结构，比如用对象或者数组装载这些参数，好方便调整变化。然而，虽然这么做会好些，但还是喜欢挑选那种更现代、更灵活的家伙。

	
		if(window.localStorage){
			alert("浏览器支持localStorage");
		}else{
			alert("浏览器暂不支持localStorage");
		}
		
		if(window.sessionStorage){
			alert("浏览器支持sessionStorage");
		}else{
			alert("浏览器暂不支持sessionStorage")
		}
	

七、我的个人体验和对未来的展望

在工作中，我慢慢摸索出了自己处理参数传递的一套办法。遇到简单的、没啥机密的参数，我就用GET传过去；如果要存点数据但不用持久保存，那我就用SESSIONSTORAGE；要是遇到了复杂项目，需要很高自由度和易维护性，那我可能就要用到AJAX或者WEBSOCKETS这些高级玩意儿了。科技每天都在进步，我觉得以后应该还会涌现出更多更高效、更安全的传输方式，让页面间传递参数变得更轻松点儿！

总之，页面间传参就是前端开发里很关键的部分。只有多练习、学习，才能熟练运用各种传参方法。希望我这点小经验能帮到你们~在实战中又是怎么处理的？快来评论区跟大家分享！咱们一起学一起进步！记得点赞分享，让更多朋友加入讨论！

	$('#page_Parameter1').live('pageshow', function(event, ui){
		alert("第二个界面的参数：" + sessionStorage.id);
	});



	

		

			
页面参数传递
		
		

			
传递参数进入下一页，以Alert方式显示参数内容。

			传递参数进入下一页

			
		

	
	

		

			
页面参数传递
		
		

			
通过Alert显示来自前一个界面的参数。

				返回