JavaScript数组,JSON对象实现动态添加、修改、删除功能示例


Posted in Javascript onMay 26, 2018

本文实例讲述了JavaScript数组,JSON对象实现动态添加、修改、删除功能。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>javascript里面的数组,json对象,动态添加,修改,删除示例</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
var a = JSON.parse("{\"title\":\"\",\"data\":[]}");
var b = JSON.parse("{\"id\":\"2\"}");
var c = JSON.parse("{\"id\":\"3\"}");
var d = JSON.parse("{\"id\":\"4\"}");
var e = JSON.parse("{\"id\":\"5\"}");
var f = JSON.parse("{\"id\":\"6\"}");
function myObjectPush() {
debugger;
/* javascript里面的数组,json对象,动态添加,修改,
删除示例 只要适合Javascript的方法都是可以用在JSON对象的数组中的!
所以还有另外的方法splice( )进行crud操作!
*/
//增加属性
$(a).attr("id", "1");
//增加子对象
a.data.push(b);//数组最后加一条记录
a.data.push(c);
a.data.push(d);
a.data.unshift(d);//数组最前面加一条记录
//修改子对象及属性
a.title = "这是json名字";
//删除子对象
//json的删除有很多种,直接用过 delete json对象方式:
delete a.data[1];
a.data.pop(); //删除最后一项
a.data.shift(); //删除第一项
a.data.splice(0, 1); //删除指定子对象,参数:开始位置,删除个数
//替换不删除
a.data.splice(1, 0, e, f);//开始位置,删除个数,插入对象
//替换并删除 a.data.splice(0, 1, e, f);//开始位置,删除个数,插入对象
console.log(a);
}
</script>
</head>
<body onload="myObjectPush()">
</body>
</html>

运行结果:

JavaScript数组,JSON对象实现动态添加、修改、删除功能示例

Javascript 相关文章推荐
JavaScript中void(0)的具体含义解释
Feb 27 Javascript
JavaScript 对象成员的可见性说明
Oct 16 Javascript
JavaScript ECMA-262-3 深入解析.第三章.this
Sep 28 Javascript
九种js弹出对话框的方法总结
Mar 12 Javascript
JQuery与Ajax调用新浪API获取短网址的代码
Feb 07 Javascript
一个不错的字符串转码解码函数(自写)
Jul 31 Javascript
node.js中的fs.fstatSync方法使用说明
Dec 15 Javascript
Eclipse编辑jsp、js文件时卡死现象的解决办法汇总
Feb 02 Javascript
Jquery为DIV添加click事件的简单实例
Jun 02 Javascript
js实现常见的工具条效果
Mar 02 Javascript
详解vue-admin和后端(flask)分离结合的例子
Feb 12 Javascript
vue组件中实现嵌套子组件案例
Aug 31 Javascript
angularJS开发注意事项
May 26 #Javascript
JavaScript继承与多继承实例分析
May 26 #Javascript
jquery ajaxfileuplod 上传文件 essyui laoding 效果【防止重复上传文件】
May 26 #jQuery
Vue仿支付宝支付功能
May 25 #Javascript
微信小程序实现人脸检测功能
May 25 #Javascript
微信小程序实现人脸识别
May 25 #Javascript
微信小程序实现刷脸登录
May 25 #Javascript
You might like
咖啡豆的最常见发酵处理方法,详细了解一下
2021/03/03 冲泡冲煮
用PHP将数据导入到Foxmail
2006/10/09 PHP
php版微信js-sdk支付接口类用法示例
2016/10/12 PHP
javascript读取xml
2006/11/04 Javascript
JavaScript在IE和Firefox浏览器下的7个差异兼容写法小结
2010/06/18 Javascript
JavaScript高级程序设计 阅读笔记(十七) js事件
2012/08/14 Javascript
JQuery实现点击div以外的位置隐藏该div窗口
2013/09/13 Javascript
javascript删除元素节点removeChild()用法实例
2015/05/26 Javascript
JavaScript学习笔记之数组去重
2016/03/23 Javascript
JavaScript的ExtJS框架中表格的编写教程
2016/05/21 Javascript
JavaScript跨域调用基于JSON的RESTful API
2016/07/09 Javascript
jQuery学习笔记之回调函数
2016/08/15 Javascript
Javascript实现前端简单的路由实例
2016/09/11 Javascript
Node.js中你不可不精的Stream(流)
2018/06/08 Javascript
JavaScript数据结构与算法之检索算法实例分析【顺序查找、最大最小值、自组织查询】
2019/02/22 Javascript
js判断一个对象是数组(函数)的方法实例
2019/12/19 Javascript
Node.JS如何实现JWT原理
2020/09/18 Javascript
[04:29]2014DOTA2国际邀请赛 主赛事第三日TOPPLAY
2014/07/21 DOTA
python 测试实现方法
2008/12/24 Python
python如何将图片转换为字符图片
2020/08/19 Python
可能是最全面的 Python 字符串拼接总结【收藏】
2018/07/09 Python
mac系统下Redis安装和使用步骤详解
2019/07/09 Python
python3中pip3安装出错,找不到SSL的解决方式
2019/12/12 Python
python创建文本文件的简单方法
2020/08/30 Python
python boto和boto3操作bucket的示例
2020/10/30 Python
飞利浦西班牙官方网站:Philips西班牙
2020/02/17 全球购物
艺术系大学生毕业个人自我评价
2013/09/19 职场文书
股份转让协议书
2014/04/12 职场文书
2014收银员工作总结范文
2014/12/16 职场文书
申请吧主发表的感言
2015/08/03 职场文书
Python一些基本的图像操作和处理总结
2021/06/23 Python
python机器学习实现oneR算法(以鸢尾data为例)
2022/03/03 Python
基于Redis6.2.6版本部署Redis Cluster集群的问题
2022/04/01 Redis
SONY AN-LP1 短波有源天线放大器图
2022/04/05 无线电
详细介绍Java中的CyclicBarrier
2022/04/13 Java/Android
Python中的 enumerate和zip详情
2022/05/30 Python