html url如何传送参数数据呢?详解三种常用的传值方式

作者:IT技术 | 时间:2018-11-09

html url如何传送参数数据呢?本文给大家详细讲解三种常用的传值方式,希望能对大家有帮助。

1,get方式,直接在url链接后面携带参数

例如:

window.location.href='localhost:8080/xx/xx.html?orgid=1&orglevel=2&orgseq=3'

这种方式取值方便但get方式字符长度有限制。


2、通过cookie传值

可以把数据存储在cookie中,网页之间是可以共享cookie中的数据,在需要数据的页面取出来。

存储cookie可以用js默认的方法,也可以用插件jquery.cookie.js。

$.cookie("a","12");   设置

var param = $.cookie("a");   获取
console.log(param); 

相对来说插件jquery.cookie.js还是比较方便的,引入后直接就可以使用了。

不过cookie只能存储少量数据

3、通过h5的localStorage存储数据

这个方式利用了HTML5的新特性localStorage,localStorage支持5M大小的数据存贮,比cookie的4k大了不少。

例如:

a.html页面存数据

<input type="text" name="username" /> 
<input type="button" name="" value="post" onclick="set()"/> 
<script> 
  function set() { 
    //由于是一个新的技术,你可以通过下面的代码检测你的浏览器是否支持 
    if (window.localStorage) { 
    //存储变量的值 
      localStorage.name = document.all.username.value; 
      location.href = './b.html'; 
    } else { 
      alert("NOT SUPPORT"); 
    } 
  } 
</script>

b.html取数据

<script> 
  var value = localStorage["name"]; 
  alert(value); 
</script>

以上就是三种常用的html url传送参数数据的方式,第一第二种因为用的比较久了,相对稳定,第三种因为是Html5新出的技术,有个别浏览器兼容的问题,需要考虑浏览器是否都支持。