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 相关文章推荐
又一个图片自动缩小的JS代码
Mar 10 Javascript
jquery ajax学习笔记2 使用XMLHttpRequest对象的responseXML
Oct 16 Javascript
使用Chrome浏览器调试AngularJS应用的方法
Jun 18 Javascript
javascript中递归函数用法注意点
Jul 30 Javascript
在ASP.NET MVC项目中使用RequireJS库的用法示例
Feb 15 Javascript
JS实现左右无缝轮播图代码
May 01 Javascript
浅谈js中同名函数和同名变量的执行问题
Feb 12 Javascript
JS实现中国公民身份证号码有效性验证
Feb 20 Javascript
Angular.js中数组操作的方法教程
Jul 31 Javascript
史上最全JavaScript常用的简写技巧(推荐)
Aug 17 Javascript
js抽奖转盘实现方法分析
May 16 Javascript
Vue Element plus使用方法梳理
Dec 24 Vue.js
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初学者头疼十四条问题大总结
2008/11/12 PHP
PHP实现获取域名的方法小结
2014/11/05 PHP
Laravel框架自定义公共函数的引入操作示例
2019/04/16 PHP
js获取本机的外网/广域网ip地址完整源码
2013/08/12 Javascript
浅析JavaScript中的CSS属性及命名规范
2013/11/28 Javascript
javascript 拷贝节点cloneNode()使用介绍
2014/04/03 Javascript
JQuery记住用户名和密码的具体实现
2014/04/04 Javascript
使用nodejs开发cli项目实例
2015/06/03 NodeJs
React Router基础使用
2017/01/17 Javascript
JavaScript中undefined和null的区别
2017/05/03 Javascript
JS查找数组中重复元素的方法详解
2017/06/14 Javascript
js实现1,2,3,5数字按照概率生成
2017/09/12 Javascript
angularJS实现不同视图同步刷新详解
2018/10/09 Javascript
Vue移动端项目实现使用手机预览调试操作
2020/07/18 Javascript
javascript实现下拉菜单效果
2021/02/09 Javascript
[02:21]2018完美盛典章节片——初心
2018/12/17 DOTA
python之matplotlib学习绘制动态更新图实例代码
2018/01/23 Python
python3 读写文件换行符的方法
2018/04/09 Python
利用python如何处理nc数据详解
2018/05/23 Python
numpy返回array中元素的index方法
2018/06/27 Python
python pygame实现2048游戏
2018/11/20 Python
django之自定义软删除Model的方法
2019/08/14 Python
使用Django搭建一个基金模拟交易系统教程
2019/11/18 Python
Booking.com荷兰:全球酒店网上预订
2017/08/22 全球购物
Omio俄罗斯:一次搜索公共汽车、火车和飞机的机票
2018/11/17 全球购物
Smilodox官方运动服装店:从运动服到健身配件
2020/08/27 全球购物
领导视察欢迎词
2014/01/15 职场文书
护士毕业生自荐信
2014/02/07 职场文书
国窖1573广告词
2014/03/21 职场文书
骨干教师考核评语
2014/12/31 职场文书
事业单位财务人员岗位职责
2015/04/14 职场文书
杨善洲观后感
2015/06/04 职场文书
2016党员党课心得体会
2016/01/07 职场文书
听课评课活动心得体会
2016/01/15 职场文书
2019通用版劳动合同范本!
2019/07/11 职场文书
新手入门Jvm-- JVM对象创建与内存分配机制
2021/06/18 Java/Android