2017年10月31日，今天是万圣节，欢乐谷搞事情。
刚接触前端那会是分不清，前端和后台的，后台的数据如何传输到前端的。
现在用的还是Jquery的ajax请求后台数据到前端页面的，需要学习的地方还有很多，任重而道远也。
前后端分离，你是如何定义的呢？我现在公司现在用的php后台语言，现在逐步转型到Java，在此记录一点点变化，用作后面追忆
岁月的时候，可以作为回忆的印记。
技术：
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title></title> 7 </head> 8 9 <body> 10 <p>如果你浏览器的URL是：http://127.0.0.1:8020/web-demo/demodemo/data02.html?id=88&topId=66&artId=6868&findId=999</p> 11 </body> 12 <script type="text/javascript"> 13 //1.通过下面封装对方法，查询对应对参数 14 var id = getQueryString("id"); 15 var topId = getQueryString("topId"); 16 var artId = getQueryString("artId"); 17 var findId = getQueryString("findId"); 18 //2.封装的一个函数对URL后面的参数进行查询，可以直接复制在项目中使用 19 function getQueryString(name) { 20 var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); 21 var r = window.location.search.substr(1).match(reg); 22 if(r != null) return unescape(r[2]); 23 return ''; 24 }; 25 //3.在控制台打印对应对参数 26 console.log(id); //88 27 console.log(topId); //66 28 console.log(artId); //6868 29 console.log(findId); //99 30 </script> 31 32 </html>
我们从一个页面到另外一个页面的时候，有时候需要带一个参数过去，加以区分，这个时候就需要用到URL后面把参数带过去。
http://127.0.0.1:8020/web-demo/demodemo/data02.html?id=88&topId=66&artId=6868&findId=999
例如上面这个链接，我们只需要在链接最后通过?xxx=&xxx=&xxx=这样的方式把参数通过URL传递到另外一个页面，注意?xxx=只能只能出现一次，后面的参数我们通过&xxx=传递；
其中xxx为你传递的参数。
参数带过去，我们可以通过下面的函数把它提取出来：
1 function getQueryString(name) { 2 var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); 3 var r = window.location.search.substr(1).match(reg); 4 if(r != null) return unescape(r[2]); 5 return ''; 6 };
上面这个方法只能提前数字和字母，不能提起中文。在后续传递中文的过程中，无法把参数给提取出来。经过研究，可以使用另外一种方法，既可以提取中文也可以提取英文。
1 getQueryStringZH: function() { 2 var url = window.location.search; //获取url中"?"符后的字串 3 var theRequest = new Object(); 4 if(url.indexOf("?") != -1) { 5 var str = url.substr(1); 6 strs = str.split("&"); 7 for(var i = 0; i < strs.length; i++) { 8 //就是这句的问题 9 theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]); 10 //之前用了unescape() 11 //才会出现乱码 12 } 13 } 14 return theRequest; 15 },
注意你提起出来的是一个对象，需要通过提起对象的参数而获得参数。
var getRequest = common.getQueryStringZH();
var companyName = getRequest.companyName;
然后你就可以在文档中，随意使用了。