jQuery创建json对象 方法二：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>创建json对象第二种方法</title>

    </head>

    <body>

        <ul>

            <li>姓名：<span class="name"></span></li>

            <li>年龄：<span class="age"></span></li>

            <li>性别：<span class="sex"></span></li>

            <li>地址：<span class="address"></span></li>

        </ul>

    </body>

    <script src="js/jquery-2.1.0.js"></script>

    <script type="text/javascript">

        $(function(){

            // 创建json对象

            var str=[

                {

                    name:"小明",

                    age:20,

                    sex:"男",

                    address:"火星"

                },

                {

                    name:"小芳",

                    age:18,

                    sex:"女",

                    address:"火星"

                }

            ];

            // 访问对象

            var main="";

            $.each(str,function(i){

                // 字符串模板拼接法

                main+=`

                    <li>姓名：<span class="name">${str[i].name}</span></li>

                    <li>年龄：<span class="age">${str[i].age}</span></li>

                    <li>性别：<span class="sex">${str[i].sex}</span></li>

                    <li>地址：<span class="address">${str[i].address}</span></li>

                `;

            });

            $("ul").html(main);

        });

    </script>

</html>

创建json对象的更多相关文章

  1. 简单使用JSON,JavaScript中创建 JSON 对象(一)

    JSON:JavaScript 对象表示法(JavaScript Object Notation). JSON 是存储和交换文本信息的语法.类似 XML. JSON 比 XML 更小.更快,更易解析. ...

  2. js如何创建JSON对象

    js如何创建JSON对象 一.总结 一句话总结:直接创建js数组和js对象即可,然后JSON.stringify就可以获取json字符串,js中的一切都是对象,而且js中的对象都是json对象 js ...

  3. javascript学习-创建json对象数据，遍历

    之前我已经有讲过后台返回json数据到前台,并在前台遍历json数据. 这里讲下直接在JS里创建JSON数据,然后遍历使用~ 创建代码例如以下:(创建的是JSON对象) var YearSelect ...

  4. java链式创建json对象

    我们主要介绍一下:java中如何通过最简单的方式实现链式创建json对象,解决创建json代码臃肿的问题. 1.假设我们要创建一个json对象格式如下: { "code": 0, ...

  5. Java对象与JSON互相转换jsonlib以及手动创建JSON对象与数组——(二)

    首先声明一下,jsonlib转换与GSON相比太差劲了,操作不是一般的繁琐.GSON可以直接转换成各种集合与对象类型.强烈推荐使用GSON.而且GSON一个方法就可以解决,jsonlib转来转去太繁琐 ...

  6. Jquery创建JSON对象

    <html> <body> <h2>通过 JSON 字符串来创建对象</h3> <p> First Name: <span id=&q ...

  7. js创建json对象

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. js 创建 JSON对象

    //定义变量 var Type = [{}]; Type.push({ label: "labelname", value: "value" });

  9. java对象和json对象之间互相转换

    import java.util.ArrayList;import java.util.Collection;import java.util.Iterator;import java.util.Li ...

随机推荐

  1. SR论文代码汇总

    1.SRCNN 页面  里面有论文,matlab和caffe代码. Tensorflow https://github.com/tegg89/SRCNN-Tensorflow 2.ESPCN 论文链接 ...

  2. 小D课堂-SpringBoot 2.x微信支付在线教育网站项目实战_2-6.Mysql逆向工程效率神器之使用IDE自动生成Java实体类

    笔记 6.Mysql逆向工程效率神器之使用IDE自动生成Java实体类     简介:实战使用IDE根据Mysql自动生成java pojo实体类                  1.IDEA连接数 ...

  3. Linux (Ubuntu)安装svn

    1 先查看是否已经安装了svn 如果没有安装svn则: ubuntu@ip----:~$ svn --version The program 'svn' is currently not instal ...

  4. HTMLCollection对象和NodeList对象

    前言 首先我们先来看下面的demo,假如我们需要给所有的li字体变一个颜色. <!DOCTYPE html> <html lang="en"> <he ...

  5. SpringCloud简历模板

    项目三:智慧生鲜(SpringCloud) 开发周期:5个月项目介绍:该项目是一个基于微服分布式的生鲜电商网站,主要模块有前台:用户模块.商品模块.购物车模块.订单模块.支付模块.抢购模块.后台:权限 ...

  6. SpringCloud学习（三）服务消费者（Feign）(Finchley版本)

    上一篇文章,讲述了如何通过RestTemplate+Ribbon去消费服务,这篇文章主要讲述如何通过Feign去消费服务. Feign简介 Feign是一个声明式的伪Http客户端,它使得写Http客 ...

  7. python 调试技巧

    1.以前都是用print来定位哪里报错,后面发现一个新的调试技巧 import pdb for i in range(nrows): : content = table.row_values(i) p ...

  8. sql普通语句

    select DISTINCT t_id from nrc_newsDISTINCT不会输出相同的值select top 5 * from nrc_news;检索前五行select * from nr ...

  9. Django 框架学习 ---- 安装

    这里引用了源码方式安装: 1.git clone https://github.com/django/django.git 2.cd django/ 3.python setup.py install ...

  10. [bzoj3043]IncDec Sequence_差分

    IncDec Sequence 题目大意:给定一个长度为n的数列{a1,a2...an},每次可以选择一个区间[l,r],使这个区间内的数都加一或者都减一.问至少需要多少次操作才能使数列中的所有数都一 ...