ajax请求json用each和for循环遍历+储存session基本案例

120 阅读1分钟
json
{
    "test":[
        {"id":"1","dsn":"alibaba","pn":"payfor","src":"./img/1.jpg","email":"yang@qq.com"},
        {"id":"2","dsn":"tengxun","pn":"QQ","src":"./img/2.jpg","email":"longdaye@qq.com"},
        {"id":"3","dsn":"google","pn":"sq","src":"./img/3.jpg","email":"l23@qq.com"}
        ]
}
css
<style type="text/css">
.ea{margin:0;padding:0}
.ea li {float:left;margin-right:1px;text-decoration:none;}
</style>
html
<ul class="ea"></ul>
js
<script type="text/javascript">
			$(function() {
				$.ajax({
					type: "get",
					url: "js/data.json",
					async: true,
					dataType: "json",
					success: function(data) {
						console.log(data);

						//var msg = ''
						//each循环
						//						$.each(data.test, function(i, v) {
						//							console.log(v.dsn);
						//							msg += "<li><img src="+v.src+" title="+v.dsn+" /></li>"
						//						});
						//$('.ea').html(msg)
						//for循环
						var mss = '';
						for(var i = 0; i < data.test.length; i++) {
							console.log(data.test[i].src)
							mss += "<li><img src=" + data.test[i].src + " title=" + data.test[i].dsn + " /></li>"
						}
						$(".ea").html(mss);
						sessionStorage.setItem('ds', data.test[1].id);
						var dd = sessionStorage.getItem('ds')
						console.log(dd);
					},
					error: function(data) {
						console.log(data)
					}
				});
			})
		</script>