前端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. ...
随机推荐
- Windows平台整合SpringBoot+KAFKA__第2部分_代码编写前传
开始准备写测试代码 看半天不太懂(我也算是小白级别的,看我搞windows版本的kafka就知道了), 看文档无聊,偶然看到一个KAFKA的windows管理程序,于是就试试就装了一个,感觉那个玩意也 ...
- JavaWeb学习记录
服务器端跳转(请求重定向): 1.jsp内跳转 : <jsp:forward page="page_scope_03.jsp"/> 客户端跳转(请求转发): 1.通过超 ...
- 【剑指Offer】面试题10- I. 斐波那契数列
题目 写一个函数,输入 n ,求斐波那契(Fibonacci)数列的第 n 项.斐波那契数列的定义如下: F(0) = 0, F(1) = 1 F(N) = F(N - 1) + F(N - 2) ...
- LeetCode#3 - 无重复字符的最长字串(滑动窗口)
题目: 给定一个字符串,请你找出其中不含有重复字符的 最长子串 的长度. 示例: abcabcbb 输出的结果应该是3,最长的无重复的字串是'abc' 果然无论做什么都要静下心来啊!昨晚上卡了一个多小 ...
- UVA - 10003 Cutting Sticks(切木棍)(dp)
题意:有一根长度为L(L<1000)的棍子,还有n(n < 50)个切割点的位置(按照从小到大排列).你的任务是在这些切割点的位置处把棍子切成n+1部分,使得总切割费用最小.每次切割的费用 ...
- mac允许“任何来源”下载的应用
刚买的mac电脑,我们不止在App Store上下载,还会通过浏览器下载 有的时候需要下载一些破解的软件,这个时候安装会提示文件被破坏,很是头疼 不用着急,这是因为mac会判断app如果被破坏,就不允 ...
- Ubuntu16.04 在Windows10 系统下的安装(双系统)
楼主最近升级了一个固态+8G双通道内存条,重装了一下win10和ubuntu系统,过程中遇到一些问题,push上来供自己和大家参考.比较好用的博客教程直接贴链接. 一.win10系统 学校有正版软件许 ...
- 开源Git代码托管平台
开源Git代码托管平台主要参考有以下4个: 1.GitHub 很多开源项目都来自GitHub,但是GitHub只能新建公开的Git仓库,私有 仓库要收费.GitHub地址:https://github ...
- Nginx负载均衡(转发)
http://www.cnblogs.com/jalja/p/6117881.html 一.反向代理 正向代理: 客户端要获取的资源就在服务器上,客户端请求的资源路径就是最终响应资源的服务器路径,这就 ...
- Mount error(5):Input/output error on mount
https://superuser.com/questions/850301/mount-error5input-output-error-on-mount When setting up a sha ...