`
dyllove98
  • 浏览: 1409456 次
  • 性别: Icon_minigender_1
  • 来自: 济南
博客专栏
73a48ce3-d397-3b94-9f5d-49eb2ab017ab
Eclipse Rcp/R...
浏览量:39188
4322ac12-0ba9-3ac3-a3cf-b2f587fdfd3f
项目管理checkList...
浏览量:80266
4fb6ad91-52a6-307a-9e4f-816b4a7ce416
哲理故事与管理之道
浏览量:133389
社区版块
存档分类
最新评论

js遍历json数据

阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>网站</title>
<meta name="keywords"/>
<meta name="description"/>
<style type="text/css" media="screen">
<!--
	@import url(http://www.tuxi.com.cn/sanew/share/css/style.css);
	@import url(http://www.tuxi.com.cn/sanew/news/css/news.css);
-->
</style>
<script src="js/bootstat.js" language="javascript"></script>
</head>

<body>
<br /><div id="area">
	<div id="area_left">
	</div>
	<div id="area_right">
		<div class="title">
		<img src="http://www.tuxi.com.cn/sanew/news/images/xwzx_gfxw_title.jpg" width="728" height="47" id="title_img" /></div>
		<div class="con">
			<div class="bottom">
			  <div class="dh"><img src="http://www.tuxi.com.cn/sanew/news/images/news_dh.jpg" width="712" height="43" border="0" /></div>
			  <div id="news_list">
			  <center><font color="#D8B99A">正在加载数据...</font></center>
			 </div>
		   <div id="page"></div>
		  </div>
		</div>
	</div>
	<div class="clear"></div>
</div>
<div style=" width:1000px;margin:0 auto;"></div>
<script language="javascript" type="text/javascript" >	
function getNews(startIndex,catId)
{
  location = "getJson2.html?startIndex="+startIndex+"&catId="+catId;
}

function showNewsList(json,catId){
	 
			var list = [];
			var news = json.items;
			if(0==news.length){
			    list.push("<center><font color=\"#D8B99A\"> 对不起没有找到您想要的数据!</font></center>");
			}
				
			for (var i in news){
			    list.push("<div class=\"text\">");
				list.push("<div class=\"text_left\"><a href=\"content.html?newsId="+news<i>.newsId+"\" class=\"cD8B99A\">"+news<i>.newsTitle+"</a></div>");
				list.push("<div class=\"text_right\">"+news<i>.createTime+"</div>");
				list.push("<div class=\"clear\"></div>");
				list.push("</div>");     
	       	} 	
	
	     	document.getElementById("news_list").innerHTML = list.join('');
			
			var page = [];
			if(0<news.length){	
				page.push("<a href=\"javascript:getNews(0,catId)\" class=\"font2_11\">第一页</a>&nbsp;&nbsp;");
				page.push("<span><a href=\"javascript:getNews("+json.previousIndex+",catId)\" class=\"font2_11\">上一页</a></span>&nbsp;&nbsp;");
				page.push(json.index+'/'+json.pageCount+'&nbsp;&nbsp;');
				page.push("<span><a href=\"javascript:getNews("+json.nextIndex+",catId)\" class=\"font2_11\">下一页</a></span>&nbsp;&nbsp;");
				var endpage = 0;
				if(json.endPage>0){
					endpage = json.endPage;
				}			
				page.push("<a href=\"javascript:getNews("+endpage+",catId)\" class=\"font2_11\">最后一页</a></span></center>");
			}
  			document.getElementById("page").innerHTML = page.join('');	    
	}
	var url = window.location.href;
	var m = url.indexOf("startIndex=");
	var n = url.indexOf("&",m+11);
	var j = url.indexOf("catId=");
	var k = url.indexOf("&",j+6);
	var startIndex=0;
	var catId=503;
	if(m>=0)
	{
			startIndex = n>m?url.substring(m+11,n):url.substring(m+11);
	}
	if(j>=0)
	{
			catId = k>j?url.substring(j+6,k):url.substring(j+6);	
	}
	if(catId==505)
	{//商务活动
		document.getElementById("title_img").src = "http://www.tuxi.com.cn/sanew/news/images/xwzx_swhd_title.jpg";
		type=505;
	}
	else if(catId==502)
	{//官方新闻
		type=502;
		document.getElementById("title_img").src = "http://www.tuxi.com.cn/sanew/news/images/xwzx_gfxw_title.jpg";
	}
	else if(catId==504)
	{//专题活动
		type=504;
		document.getElementById("title_img").src = "http://www.tuxi.com.cn/sanew/news/images/xwzx_zthd_title.jpg";
	}else if(catId==503){//系统公告
		type=503;
		document.getElementById("title_img").src = "http://www.tuxi.com.cn/sanew/news/images/xwzx_xtgg_title.jpg";
	}else if(catId==521){//媒体报道
		type=521;
		document.getElementById("title_img").src = "http://www.tuxi.com.cn/sanew/news/images/xwzx_mtbd_title.jpg";	
	}
	
	var SPL = [];
	SPL.push('http://localhost:8080/webnews-mysql/visitSpringContext.jsp');
	$LJ(SPL);
    setTimeout("showNewsList(json"+catId+","+catId+")",2000);

</script>
</body>
</html>
分享到:
评论

相关推荐

    java遍历JSON树

    ### Java遍历JSON树知识点详解 #### 一、前言 在处理Web应用程序中的数据时,JSON(JavaScript Object Notation)是一种非常常见的数据格式。它轻量级且易于读写,因此广泛应用于前后端的数据交互中。对于Java...

    遍历JSON文件内容

    总结一下,Java中遍历JSON文件主要分为四个步骤:引入JSON处理库,读取文件内容,解析JSON字符串,以及遍历和处理JSON数据结构。通过这种方式,你可以方便地操作和分析JSON文件中的任何数据,满足各种业务需求。在...

    遍历json显示树形菜单

    展示树形菜单的关键在于正确地遍历JSON数据结构。由于树形结构常常包含嵌套的子节点,递归遍历是最有效的解决方案。递归函数会调用自身来处理子节点,直到没有更多的子节点为止。例如,一个基本的递归遍历函数可能...

    Jquery遍历Json数据的方法

    ### jQuery遍历Json数据的方法知识点详解 #### 1. jQuery遍历的必要性与优势 在Web开发中,经常需要处理和展示来自服务器的数据,尤其是在构建动态的网页内容时。JSON(JavaScript Object Notation)数据格式因其...

    JS循环遍历JSON数据的方法

    JavaScript作为一种脚本语言,提供了丰富的数据结构和操作方法,能够有效地处理和遍历JSON数据。循环遍历JSON数据的方法在处理诸如列表数据、配置项、服务器响应数据等场景中非常关键。 首先,我们来看一下如何用...

    javascript遍历json对象的key和任意js对象属性实例.docx

    ### JavaScript遍历JSON对象的Key和任意JS对象属性实例 #### 概述 在JavaScript编程中,经常需要遍历对象的属性来进行数据处理或逻辑控制。对于JSON对象(本质上是JavaScript对象的一种)和其他类型的对象,我们...

    js 遍历json返回的map内容示例代码

    本文将详细介绍如何在JavaScript中遍历JSON数据,并将遍历结果中的数据放到map对象中,以及如何通过示例代码来实现这一过程。 首先,我们来看一下遍历JSON数据的基础方法。在JavaScript中,我们通常使用循环语句如`...

    Jquery遍历json的两种数据结构[参照].pdf

    【jQuery遍历JSON的两种数据结构】 ...以上就是在JavaScript和jQuery中处理JSON数据的基本操作,包括创建、遍历、转换和发送JSON数据。正确理解和运用JSON能够极大地提高Web应用的开发效率和数据交互的便捷性。

    JS遍历JSON数组及获取JSON数组长度操作示例【测试可用】

    2. 如何使用JavaScript遍历JSON数组。 3. 如何编写函数获取JSON数组的长度。 4. for...in循环在遍历对象属性中的应用。 5. 在线工具在JSON数据处理中的使用。 6. JavaScript中关于JSON数据处理的高级技巧和最佳实践...

    JQuery遍历json数组的3种方法

    除了jQuery的$.each()方法,我们也可以使用JavaScript原生的for循环来遍历JSON数组。for循环有三种常见的形式:基本的for循环、for...in循环和for...of循环。 - 基本的for循环 基本的for循环通过指定循环的起始条件...

    Jquery遍历json的两种数据结构.pdf

    在JavaScript和jQuery中,遍历JSON数据、解析JSON字符串以及发送AJAX请求都是常见的操作。而在服务器端,Java等编程语言提供了丰富的库来处理JSON的序列化和反序列化。了解并熟练掌握JSON的使用,对于提升Web开发的...

    JS 遍历 json 和 JQuery 遍历json操作完整示例

    在实际开发中,处理 JSON 数据是常见的任务,无论是使用原生 JavaScript 还是借助 jQuery,都能有效地进行遍历和操作。了解这些基础知识对于提升网页应用的开发效率至关重要。同时,熟练运用各种在线工具也能辅助...

    Java遍历json字符串取值的实例

    在当今的软件开发中,处理JSON数据格式已经成为一项基础技能,特别是在Java语言的使用场景下。JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。本文...

    json-schema-traverse:遍历 JSON Schema 将每个架构对象传递给回调

    json-schema-traverse 遍历 JSON Schema 将每个架构对象传递给回调安装 npm install json-schema-traverse用法 const traverse = require ( 'json-schema-traverse' ) ;const schema = { properties : { foo : { ...

    JS动态遍历json中所有键值对的方法(不知道属性名的情况)

    在JavaScript中,遍历JSON对象通常采用`for...in`循环。这个循环会遍历一个对象的所有可枚举属性,包括从原型链上继承来的属性。下面是一个简单的示例: ```javascript var jsonObj = {"55":"1","70":"0","80":"2",...

    Jquery遍历json的两种数据结构.docx

    JSON,全称JavaScript Object Notation,是一种轻量级的...总的来说,JSON是Web开发中的重要工具,它简化了数据交换的过程,提高了开发效率,而jQuery提供了一套方便的API来处理JSON数据,使其在JavaScript中更加易用。

    js遍历xml,json学习

    JSON是一种轻量级的数据交换格式,它的语法与JavaScript对象相似,使得JavaScript处理JSON数据变得简单。 1. **解析JSON**: - `JSON.parse()`:将JSON字符串转换为JavaScript对象。例如:`let jsonObj = JSON....

Global site tag (gtag.js) - Google Analytics