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. 微pe安装原版win10怎么装|wepe安装原版win10 1803教程

    http://www.xitongcheng.com/jiaocheng/xtazjc_article_42199.html 怎么制作wepe启动盘?微pe是一款全新高效.多功能pe维护工具箱,同时支 ...

  2. SRCNN代码分析

    代码是作者页面上下载的matlab版.香港中文大学汤晓鸥教授.Learning a Deep Convolutional Network for Image Super-Resolution. htt ...

  3. Java SpringBoot React Redux

    1.字符串转换相关 - React 前端JS部分 JSON.parse(JSON.stringify(copyRow)); 2.字符串分隔相关,弹出confirm确认框,显示换行信息 - React ...

  4. Python-sympy科学计算与数据处理(方程,微分,微分方程,积分)

    方程 a,b,c,x = symbols("a b c x") my_eq = Eq(a*x**2+b*x+c,0) solve(my_eq,x) Out[12]: [(-b + ...

  5. React Native项目实战

    算是学习React Native的一次项目总结吧,目的还是提高自己. 包含的内容: 1>仿"美团"页面的实现; 2>封装项目中和自己常用的一些组件; 3>学习别人 ...

  6. ajax将数组或list集合传到后台 的 【坑】

    代码如下 function deleteChecked() { var orderNosList = new Array(); var rows = $("#dataGrid"). ...

  7. lua学习笔记4--XLua

    下载XLua:   https://github.com/tencent/xlua 项目中使用XLua只需将Plugins和XLua两个文件夹拷贝到U3D中即可XLua只是核心,用于实现Lua和C#交 ...

  8. guns系统部署方式及常见问题

    项目框架:guns 开发IDE:Idea 2018.1 两种打包方式:war 和jar. 1.正常打包的姿势 1.1按照下图修改为你想到打包的方式. ​ 1.2 执行打包 ​​ clean packa ...

  9. 【VS开发】CListCtrl控件使用

    为何调用了CListCtrl的InsertColumn却什么效果都没有?这个问题以前发现过,今天才清楚,那就是要把它的Style指定为LVS_REPORT.       具体做法如下:       假 ...

  10. 【图像处理】FFmpeg-0

    FFmpeg是相当强大的多媒体编解码框架,在深入分析其源代码之前必须要有基本的多媒体基础知识,否则其源代码会非常晦涩难懂.本文将从介绍一些基本的多媒体只是,主要是为研读ffmpeg源代码做准备,比如一 ...