json输出html（json输出格式）

本篇文章给大家谈谈json输出html，以及json输出格式对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

微信号：cloud7591
如需了解更多，欢迎添加客服微信咨询。
复制微信号

本文目录一览：

• 1、json转html
• 2、html怎样格式化输出JSON数据
• 3、json 数组循环输出到HTML上
• 4、怎么把json返回的数据显示到html页面上？
• 5、json.php里得到返回数据怎么输出到html里
• 6、js怎么遍历json的数组并输出到html中

json转html

function jsonclick() {

            var jsonstr = '{"desc":"OK","status":1000,"data":{"wendu":"34","ganmao":"各项气象条件适宜，发生感冒机率较低。但请避免长期处于空调房间中，以防感冒。","forecast":[{"fengxiang":"东风","fengli":"3-4级","high":"高温 35℃","type":"多云","low":"低温 27℃","date":"22日星期一"},{"fengxiang":"东风","fengli":"微风级","high":"高温 34℃","type":"多云","low":"低温 26℃","date":"23日星期二"},{"fengxiang":"东风","fengli":"微风级","high":"高温 35℃","type":"多云","low":"低温 27℃","date":"24日星期三"},{"fengxiang":"东风","fengli":"微风级","high":"高温 34℃","type":"多云","low":"低温 26℃","date":"25日星期四"},{"fengxiang":"东北风","fengli":"3-4级","high":"高温 33℃","type":"阴","low":"低温 25℃","date":"26日星期五"}],"yesterday":{"fl":"3-4级","fx":"北风","high":"高温 33℃","type":"雷阵雨","low":"低温 27℃","date":"21日星期日"},"aqi":"53","city":"常州"}}';

            var list = new Function("return" + jsonstr)();

            //html代码随便拼凑成需要的格式就行了

            var htmlstr = "ul style='border:1px solid #aaccff; height:100px; width:600px;' li 状态码："

                + list.status + "/li li 日期："

                + list.data.yesterday.date + "/li li 地址："

                + list.data.city + "/li li 预测风向："

                + list.data.forecast[0].fengxiang + "/li /ul";

            document.getElementById("id").innerHTML = htmlstr;

        }

html怎样格式化输出JSON数据

html

head

meta http-equiv=content-type content="text/html;charset=GBK"

/head

body

table border=0 cellspacing=0 cellpadding=0

tr

td id="a"sdfsd/td

/tr

tr

td id="b"sdfsdf/td

/tr

tr

td id="c"sdfsd/td

/tr

tr

td id="d"sdfsdf/td

/tr

/table

/body

script

var jsonStr = "{\"a\":\"内容1\", \"b\":\"内容2\",\"c\":\"内容3\",\"d\":\"内容4\"}";

var jsonObj = eval("(" + jsonStr + ")");

for(var property in jsonObj){

var nodeObj = document.getElementById(property);

if(nodeObj)

nodeObj.childNodes[0].nodeValue = jsonObj[property];

}

/script

/html

json 数组循环输出到HTML上

$(eval(result)).each(function(i,obj){

    //你这个id写错了，没有id啊，报错了，所以没有显示

    $("#pro"+id).html(obj.Province);

});

怎么把json返回的数据显示到html页面上？

把json返回的数据显示到html页面上的代码如下：

html中写姓名：span id="username"/span

js中写：

$(function () {

$.ajax({

type: "post",

url: "你后台返回json的页面地址",

dataType: "json",

data: {"operation":"getsiteroomname","bigcatid":bigcatid},//传递到后台页面的参数，没有就不要了

contentType: "application/x-www-form-urlencoded; charset=utf-8",

success: function(data) {

console.log(data);//将返回的值打印出来看看，然后你就知道怎么用了，可能如data.username

var xm=data.username;

$("#username").text(xm);

},

error: function (XMLHttpRequest, textStatus, errorThrown) {

alert('系统错误，联系管理员');

}

});

}

知识延展：

超文本标记语言， 标准通用标记语言下的一个应用。

“ 超文本 ”就是指页面内可以包含图片、 链接，甚至音乐、 程序等非文字元素。

超文本标记语言的结构包括 “头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的 具体内容。

json.php里得到返回数据怎么输出到html里

用json_decode()将json字符串转化成php数组，然后直接循环数组取出值即可。

?php

$content= file_get_contents('获取json字符串的url');

$content = json_decode($content);//将json字符串转化成php数组

foreach ($content as $key ) {//循环数组

echo 'li' . $key['city'] . '/li';

echo 'li' . $key['city_en'] . '/li';

echo 'li' . $key['date_y'] . '/li';

echo 'li' . $key['week'] . '/li';

}

js怎么遍历json的数组并输出到html中

例如数据库里面的json字符串是这样的

?

1

2

3

4

5

var str = '[{"name":"宗2瓜","num":"1","price":"122"},{"name":"宗呱呱","num":"1","price":"100"}]';

var xqo = eval('(' + str + ')');

for(var i in xqo){

alert(xqo[i].name);

}

上面的是js的,下面的是jquery来解析json字符串,

?

1

2

var cc = jQuery.parseJSON(data);

alert(cc[0].title);

关于json输出html和json输出格式的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。