前端页面存取数据

如果使用本地存储如：cookie，localStorage，sessionStorage，Web SQL的情况下，前端存取数据非常容易。

本文介绍，不使用以上本地存储，只在页面（标签里面）上存取数据。

最简单的一种做法是隐藏表单或者隐藏元素都可以：

<div style="dispaly:none" class="data">${后台穿过来的数据}</div>

这种做法在获取数据的时，jquery选择器选择元素的时候比较麻烦。而且给页面增加了不必要的内容。

注意，id或者class是不能传递数据的，因为获取不到id和class的内容，他们是作为页面元素的标示存在的。在jquery选择器里用来指定元素。

Html5有个data-*属性可以实现这一点：

<div id="name" data-test="${后台穿过来的数据}"></div>

<script>

//获取的话用jquery里的data()方法：

var data-test = $("#name").data("test")

</script>

当然，js比较熟悉的话，在标签里可以自定义属性来实现存储数据：

<div id="name" userName="${后台穿过来的数据}">name</div>
 <script>
		var user = document . getElementById ( ‘name‘ ) ;
		var userName =  user . getAttribute ( ‘userName‘ );
		alert(userName);//${后台穿过来的数据}
</script>

以上的方法都能实现保存后端传过来的数据，而并不在页面上显示。　

jquery中有属性选择器：[]，属性除了保存数据，还可以作为选择元素使用。