JavaScript splice()方法详解


Posted in Javascript onSeptember 22, 2020

JavaScript splice() 方法

数组中添加新元素:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js数组添加元素_三水点靠木</title>
</head>
<body>

<p id="demo">点击按钮向数组添加元素。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var fruits = ["Banana", "Orange", "Apple", "Mango"];
	fruits.splice(2,0,"Lemon","Kiwi");
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>
</html>

splice定义和用法

splice() 方法用于添加或删除数组中的元素。

注意:这种方法会改变原始数组。

返回值

如果仅删除一个元素,则返回一个元素的数组。 如果未删除任何元素,则返回空数组。

JavaScript splice()方法详解

语法

array.splice(index,howmany,item1,.....,itemX)

参数 Values

参数 描述
index 必需。规定从何处添加/删除元素。 该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany 可选。规定应该删除多少元素。必须是数字,但可以是 "0"。 如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1, ..., itemX 可选。要添加到数组的新元素

返回值

Type 描述
Array 如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。

更多实例

实例

移除数组的第三个元素,并在数组第三个位置添加新元素:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>三水点靠木</title>
</head>
<body>

<p id="demo">点击按钮添加和删除元素。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var fruits = ["Banana", "Orange", "Apple", "Mango"];
	fruits.splice(2,1,"Lemon","Kiwi");
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>
</html>

实例
从第三个位置开始删除数组后的两个元素:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>三水点靠木</title>
</head>
<body>

<p id="demo">点击按钮删除数组中的两个元素。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var fruits = ["Banana", "Orange", "Apple", "Mango"];
	fruits.splice(2,2);
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>
	
</body>
</html>

到此这篇关于JavaScript splice()方法详解的文章就介绍到这了,更多相关JavaScript splice()内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
用js计算页面执行时间的函数
Dec 07 Javascript
eval的两组性能测试数据
Aug 17 Javascript
一个背景云变换js特效 鼠标移动背景云变化
Dec 28 Javascript
jquery的ajaxSubmit()异步上传图片并保存表单数据演示代码
Jun 04 Javascript
浅析JavaScript中break、continue和return的区别
Nov 30 Javascript
JavaScript实现二维坐标点排序效果
Jul 18 Javascript
在ABP框架中使用BootstrapTable组件的方法
Jul 31 Javascript
JavaScript实现QQ列表展开收缩扩展功能
Oct 30 Javascript
浅谈vue自定义全局组件并通过全局方法 Vue.use() 使用该组件
Dec 07 Javascript
Node.js中你不可不精的Stream(流)
Jun 08 Javascript
基于vue写一个全局Message组件的实现
Aug 15 Javascript
vue移动端弹起蒙层滑动禁止底部滑动操作
Jul 22 Javascript
javascript与cookie 的问题详解
Nov 11 #Javascript
JavaScript设置首页和收藏页面的小例子
Nov 11 #Javascript
JS将表单导出成EXCEL的实例代码
Nov 11 #Javascript
AJAX跨域请求json数据的实现方法
Nov 11 #Javascript
Javascript弹出窗口的各种方法总结
Nov 11 #Javascript
探讨js中的双感叹号判断
Nov 11 #Javascript
js时间戳格式化成日期格式的多种方法
Nov 11 #Javascript
You might like
PHP开发文件系统实例讲解
2006/10/09 PHP
PHP4引用文件语句的对比
2006/10/09 PHP
网页游戏开发入门教程二(游戏模式+系统)
2009/11/02 PHP
PHP+JS+rsa数据加密传输实现代码
2011/03/23 PHP
在WAMP环境下搭建ZendDebugger php调试工具的方法
2011/07/18 PHP
将php数组输出html表格的方法
2014/02/24 PHP
php数组和链表的区别总结
2019/09/20 PHP
jquery 插件 任意位置浮动固定层
2008/12/25 Javascript
textarea中的手动换行处理的jquery代码
2011/02/26 Javascript
一个关于jqGrid使用的小例子(行按钮)
2011/11/04 Javascript
IE下Ajax缓存问题的快速解决方法(get方式)
2014/01/09 Javascript
jQuery获取URL请求参数的方法
2015/07/18 Javascript
JS快速实现移动端拼图游戏
2016/09/05 Javascript
JavaScript异步上传图片文件的实例代码
2017/07/04 Javascript
Node.js+jade抓取博客所有文章生成静态html文件的实例
2017/09/19 Javascript
Angular中支持SCSS的方法
2017/11/18 Javascript
vue 项目中使用Loading组件的示例代码
2018/08/31 Javascript
[50:22]完美盛典-2018年度红毯走秀
2018/12/16 DOTA
python使用paramiko模块实现ssh远程登陆上传文件并执行
2014/01/27 Python
python实现在windows下操作word的方法
2015/04/28 Python
python实现微信跳一跳辅助工具步骤详解
2018/01/04 Python
python实现图片筛选程序
2018/10/24 Python
Django连接数据库并实现读写分离过程解析
2019/11/13 Python
Python对称的二叉树多种思路实现方法
2020/02/28 Python
python为QT程序添加图标的方法详解
2020/03/09 Python
Python正则re模块使用步骤及原理解析
2020/08/18 Python
HTML5新标签兼容——&gt; 的两种方法
2018/09/12 HTML / CSS
Black Halo官方网站:购买连衣裙、礼服和连体裤
2018/06/13 全球购物
工作说明书范文
2014/05/07 职场文书
我的中国梦演讲稿800字
2014/08/19 职场文书
大型公益活动策划方案
2014/08/20 职场文书
学校组织向国旗敬礼活动方案(中小学适用)
2014/09/27 职场文书
个人委托书范文
2015/01/28 职场文书
个人廉洁自律总结
2015/03/06 职场文书
2015年高三年级组工作总结
2015/07/21 职场文书
win11怎么消除图标小盾牌?win11消除图标小盾牌解决方法
2022/08/05 数码科技