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 相关文章推荐
JavaScript中Array 对象相关的几个方法
Dec 22 Javascript
可实现多表单提交的javascript函数
Aug 01 Javascript
利用WebBrowser彻底解决Web打印问题(包括后台打印)
Jun 22 Javascript
解析URI与URL之间的区别与联系
Nov 22 Javascript
Javascript技术难点之apply,call与this之间的衔接
Dec 04 Javascript
vue2中filter()的实现代码
Jul 09 Javascript
JS实现合并json对象的方法
Oct 10 Javascript
关于Vue的路由权限管理的示例代码
Mar 06 Javascript
简述JS控制台的使用
Jul 15 Javascript
浅谈vue 单文件探索
Sep 05 Javascript
antd 表格列宽自适应方法以及错误处理操作
Oct 27 Javascript
解决vue侦听器watch,调用this时出现undefined的问题
Oct 30 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函数解决SQL injection
2006/12/09 PHP
php面向对象全攻略 (三)特殊的引用“$this”的使用
2009/09/30 PHP
php数组函数序列之array_search()- 按元素值返回键名
2011/11/04 PHP
php sybase_fetch_array使用方法
2014/04/15 PHP
使用GDB调试PHP代码,解决PHP代码死循环问题
2015/03/02 PHP
PHP设计模式之观察者模式实例
2016/02/22 PHP
利用PHP实现一个简单的用户登记表示例
2017/04/25 PHP
laravel5.1 ajax post 传值_token示例
2019/10/24 PHP
php中加密解密DES类的简单使用方法示例
2020/03/26 PHP
JS 继承实例分析
2008/11/04 Javascript
JS控制文本框textarea输入字数限制的方法
2013/06/17 Javascript
js调用css属性写法
2013/09/21 Javascript
Javascript对象属性方法汇总
2013/11/21 Javascript
Get中文乱码IE浏览器Get中文乱码解决方案
2013/12/26 Javascript
JavaScript Function函数类型介绍
2015/04/08 Javascript
jQuery实现对无序列表的排序功能(附demo源码下载)
2016/06/25 Javascript
jQuery实现div跟随鼠标移动
2020/08/20 jQuery
Vue使用watch监听一个对象中的属性的实现方法
2019/05/10 Javascript
微信小程序 拍照或从相册选取图片上传代码实例
2019/08/28 Javascript
Python实现优先级队列结构的方法详解
2016/06/02 Python
Python基于回溯法子集树模板实现8皇后问题
2017/09/01 Python
Python3中的列表生成式、生成器与迭代器实例详解
2018/06/11 Python
使用Python如何测试InnoDB与MyISAM的读写性能
2018/09/18 Python
Python3如何实现Win10桌面自动切换
2020/08/11 Python
FLOS美国官网:意大利高级照明工艺的传奇
2018/08/07 全球购物
Fox Racing英国官网:越野摩托车和山地自行车服装
2020/02/26 全球购物
人事部专员岗位职责
2014/03/04 职场文书
经贸专业毕业生求职信
2014/03/23 职场文书
销售顾问工作计划书
2014/09/15 职场文书
合同权益转让协议书模板
2014/11/18 职场文书
狂人日记读书笔记
2015/06/30 职场文书
2016党校培训心得体会
2016/01/07 职场文书
在K8s上部署Redis集群的方法步骤
2021/04/27 Redis
pandas提升计算效率的一些方法汇总
2021/05/30 Python
javascript的setTimeout()使用方法总结
2021/11/20 Javascript
Windows11里微软已经将驱动程序安装位置A盘删除
2021/11/21 数码科技