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 相关文章推荐
php与js的区别是什么
Aug 05 Javascript
Jquery实现的tab效果可以指定默认显示第几页
Oct 16 Javascript
如何防止回车(enter)键提交表单
May 11 Javascript
javascript实现简单加载随机色方块
Dec 25 Javascript
javascript显示上周、上个月日期的处理方法
Feb 03 Javascript
分离与继承的思想实现图片上传后的预览功能:ImageUploadView
Apr 07 Javascript
使用jQuery UI库开发Web界面的简单入门指引
Apr 22 Javascript
收藏AngularJS中最重要的核心功能
Jul 09 Javascript
js 显示日期时间的实例(时间过一秒加1)
Oct 25 Javascript
使用typescript改造koa开发框架的实现
Feb 04 Javascript
js实现翻牌小游戏
Jul 31 Javascript
JavaScript实现弹出窗口效果
Dec 09 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
高亮度显示php源代码
2006/10/09 PHP
php模拟asp中的XmlHttpRequest实现http请求的代码
2011/03/24 PHP
php一个解析字符串排列数组的方法
2015/05/12 PHP
实例讲解通过​PHP创建数据库
2019/01/20 PHP
基于prototype扩展的JavaScript常用函数库
2010/11/30 Javascript
30个最好的jQuery 灯箱插件分享
2011/04/25 Javascript
JavaSript中变量的作用域闭包的深入理解
2014/05/12 Javascript
Web程序员必备的7个JavaScript函数
2016/06/14 Javascript
Bootstrap时间选择器datetimepicker和daterangepicker使用实例解析
2016/09/17 Javascript
AngularJS操作键值对象类似java的hashmap(填坑小结)
2016/11/12 Javascript
详解nodejs中的process进程
2017/03/19 NodeJs
Bootstrap fileinput文件上传组件使用详解
2017/06/06 Javascript
基于JSON数据格式详解
2017/08/31 Javascript
webpack打包node.js后端项目的方法
2018/03/10 Javascript
js循环map 获取所有的key和value的实现代码(json)
2018/05/09 Javascript
如何使用 vue + d3 画一棵树
2018/12/03 Javascript
JavaScript中concat复制数组方法浅析
2019/01/20 Javascript
jQuery实现B2B网站后台管理系统侧导航
2020/07/08 jQuery
基于react项目打包css引用路径错误解决方案
2020/10/28 Javascript
[00:09]DOTA2全国高校联赛 精彩活动引爆全场
2018/05/30 DOTA
Python笔记(叁)继续学习
2012/10/24 Python
详解Python中的正则表达式的用法
2015/04/09 Python
Python搭建代理IP池实现获取IP的方法
2019/10/27 Python
Python中itertools的用法详解
2020/02/07 Python
python归并排序算法过程实例讲解
2020/11/04 Python
Python 使用SFTP和FTP实现对服务器的文件下载功能
2020/12/17 Python
详解Python 中的 defaultdict 数据类型
2021/02/22 Python
HTML5之SVG 2D入门10—滤镜的定义及使用
2013/01/30 HTML / CSS
联想墨西哥官方网站:Lenovo墨西哥
2016/08/17 全球购物
绿色美容,有机护肤品和化妆品:Safe & Chic
2018/10/29 全球购物
Wojas罗马尼亚网站:波兰皮鞋品牌
2018/11/01 全球购物
Haggar官网:美国男装品牌
2020/02/16 全球购物
大一新生军训时的自我评价分享
2013/12/05 职场文书
运动会邀请函范文
2014/02/06 职场文书
护士节活动总结
2014/08/29 职场文书
python数据分析之用sklearn预测糖尿病
2021/04/22 Python