前端Json 增加,删除,修改元素(包含json数组处理)
一:基础JSON对象

二:JSON数组数据

以下为增删修改方法:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Json</title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<script src="~/js/mui.min.js"></script>
<link rel="stylesheet" type="text/css" href="~/css/reset.css">
<script src="~/js/jquery1.7.2.js"></script>
</head>
<body>
<h2>清浅</h2>
</body>
</html> <Script> $(function () {
//JsonDelete();
//JsonAdd();
//JsonArryDelete();
JsonArryAdd();
}); //json对象删除数据
function JsonDelete()
{
var jsonstr = '{\"name\":\"张大佛爷\", \"Age\":\"170\", \"sex\":\"男\" }';
console.log(jsonstr); var json = JSON.parse(jsonstr);
delete json.sex;
console.log(json); jsonstr = JSON.stringify(json);
console.log(jsonstr);
} //json对象添加数据
function JsonAdd()
{
var jsonstr = '{\"name\":\"张大佛爷\", \"Age\":\"170\" }';
console.log(jsonstr); var json = JSON.parse(jsonstr);
json.sex = '男';
console.log(json); jsonstr = JSON.stringify(json);
console.log(jsonstr);
} //Json数组删除
function JsonArryDelete()
{
var jsonstr = '{\"zhang\":[{\"name\":\"张大佛爷\",\"Age\":\"170\",\"sex\":\"男\"},{\"name\":\"张启灵\",\"Age\":\"100\",\"sex\":\"男\"}],\"wu\":[{\"name\":\"吴邪\",\"Age\":\"25\",\"sex\":\"男\"}]}'; var json = JSON.parse(jsonstr);
console.log(json); //删除张起灵
delete json.zhang[1];
console.log(json); //强迫症,去掉null
var zhangstr = [];
for (var i = 0; i < json.zhang.length; i++) {
var obj = json.zhang[i];
if (obj != null)
zhangstr.push(obj);
} json.zhang = zhangstr; jsonstr = JSON.stringify(json);
console.log(jsonstr);
} //Json数组添加
function JsonArryAdd() {
var jsonstr = '{\"zhang\":[{\"name\":\"张大佛爷\",\"Age\":\"170\",\"sex\":\"男\"},{\"name\":\"张启灵\",\"Age\":\"100\",\"sex\":\"男\"}],\"wu\":[{\"name\":\"吴邪\",\"Age\":\"25\",\"sex\":\"男\"}]}'; var json = JSON.parse(jsonstr);
console.log(json); var people = {
"name": "吴三省",
"Age": "45",
"sex": "男"
} json.wu.push(people);
console.log(json); jsonstr = JSON.stringify(json);
console.log(jsonstr);
} </Script>
前端Json 增加,删除,修改元素(包含json数组处理)的更多相关文章
- 在Javascript操作JSON对象,增加 删除 修改
在Javascript操作JSON对象,增加删除修改全有的,详情见代码 <script type="text/javascript"> var jsonObj2 = { ...
- Nodejs之MEAN栈开发(九)---- 用户评论的增加/删除/修改
由于工作中做实时通信的项目,需要用到Nodejs做通讯转接功能,刚开始接触,很多都不懂,于是我和同事就准备去学习nodejs,结合nodejs之MEAN栈实战书籍<Getting.MEAN.wi ...
- AutoCad 二次开发 .net 之层表的增加 删除 修改图层颜色 遍历 设置当前层
AutoCad 二次开发 .net 之层表的增加 删除 修改图层颜色 遍历 设置当前层 AutoCad 二次开发 .net 之层表的增加 删除 修改图层颜色 遍历 设置当前层我理解的图层的作用大概是把 ...
- [JavaWeb基础] 004.用JSP + SERVLET 进行简单的增加删除修改
上一次的文章,我们讲解了如何用JAVA访问MySql数据库,对数据进行增加删除修改查询.那么这次我们把具体的页面的数据库操作结合在一起,进行一次简单的学生信息操作案例. 首先我们创建一个专门用于学生管 ...
- ztree树形菜单的增加删除修改和换图标
首先需要注意一点,如果有研究过树形菜单,就会发现实现删除和修改功能特别简单,但是增加却有一点复杂.造成这个现象是ztree树形菜单的历史遗留问题.大概是之前的版本没有增加这个功能,后来的版本加上了这个 ...
- javascript操作JSON对象,增加 删除 修改
JS只能输入数字,数字和字母等的正则表达式 1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace( ...
- Sql增加,删除,修改列
1. 查看约束条件 - MySQL: SELECT * FROM information_schema.`TABLE_CONSTRAINTS` where table_name = 'book'; - ...
- Spring Boot 增加删除修改 批量
1.批量删除 a.自定义Repositoy中写 前台处理https://blog.csdn.net/yhflyl/article/details/81557670首先前台先要获取所有的要删除数据的I ...
- php后台增加删除修改跳转页面
第一步 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...
随机推荐
- tornado+peewee-async+peewee+mysql(一)
前言: 需要异步操作MySQL,又要用orm,使用sqlalchemy需要加celery,觉得比较麻烦,选择了peewee-async 开发环境 python3.6.8+peewee-async0.5 ...
- HDU 4915 多校5 Parenthese sequence
比赛的时候想了一个自认为对的方法,WA到死,然后还一直敲下去,一直到晚上才想到反例 找是否存在解比较好找,这种左右括号序列,把(当成1,把)当成-1,然后从前往后扫,+1或者-1 遇到?就当初(,然后 ...
- 实验吧-隐写术-九连环(steghide)
下载图片: 拿到kali里binwalk发现有压缩文件,然后foremost分解出来,将分出的压缩文件打开,发现已经被加密. 到这里就有几个思路了:1)暴力破解 2)伪加密 3)继续从图片中寻找信息 ...
- oracle 使用触发器实现id自增
前提:存在数据库di_test,主键为id.1.创建一个索引sequence create sequence di_test_id minvalue 1 nomaxvalue start with 1 ...
- ELK 安装Elasticsearch
章节 ELK 介绍 ELK 安装Elasticsearch ELK 安装Kibana ELK 安装Beat ELK 安装Logstash ELK栈要安装以下开源组件: Elasticsearch Ki ...
- 在登陆退出时候使用Vuex
1.登陆的时候,在登陆模块请求接口,然后获取一个access_token,获取用户权限.保存到缓存里面. 2.退出的时候,请求退出接口,把缓存里面的access_token清除. 一旦要在登陆里面做一 ...
- c++ opencv 动态内存
1.CvMemStorage定义动态内存存储器 内存存储器是一个用来存储诸如序列.轮廓.图形和子划分等动态增长数据结构的底层结构 2.示例 CvMemStorage *mems = cvCreat ...
- Distributed--2PC和3PC
参考 https://blog.csdn.net/lnho2015/article/details/78685503 https://www.cnblogs.com/hubaoxi/p/6867203 ...
- jquery 获取同级元素
$(".userinfo-three:eq(0)").css({ "width": winWidth * 300 / 1080, ...
- CNN核心概念理解
卷积神经网络 (Convolutional Neural Networks,简称CNN),是一种经典的神经网络算法.由于在图像识别领域取得的良好效果,随着人工智能的火热,它也受到越来越多的关注.CNN ...