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 相关文章推荐
Prototype String对象 学习
Jul 19 Javascript
Javascript技巧之不要用for in语句对数组进行遍历
Oct 20 Javascript
jquery访问ashx文件示例代码
Aug 11 Javascript
详谈JS中实现种子随机数及作用
Jul 19 Javascript
基于JavaScript实现跳转提示页面
Sep 24 Javascript
JS 使用 window对象的print方法实现分页打印功能
May 16 Javascript
koa源码中promise的解读
Nov 13 Javascript
express+vue+mongodb+session 实现注册登录功能
Dec 06 Javascript
Vue 利用指令实现禁止反复发送请求的两种方法
Sep 15 Javascript
vue+elementUI动态生成面包屑导航教程
Nov 04 Javascript
es6函数中的作用域实例分析
Apr 18 Javascript
Js跳出两级循环方法代码实例
Sep 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 __call()方法实现委托示例
2019/05/20 PHP
PHP调用QQ互联接口实现QQ登录网站功能示例
2019/10/24 PHP
javascritp添加url参数将参数加入到url中
2014/09/25 Javascript
JQuery中extend的用法实例分析
2015/02/08 Javascript
jQuery插件实现控制网页元素动态居中显示
2015/03/24 Javascript
jQuery实现鼠标划过添加和删除class的方法
2015/06/26 Javascript
JavaScript实现输入框(密码框)出现提示语
2016/01/12 Javascript
Bootstrap布局组件教程之Bootstrap下拉菜单
2016/06/12 Javascript
js判断请求的url是否可访问,支持跨域判断的实现方法
2016/09/17 Javascript
详解vue父子模版嵌套案例
2017/03/04 Javascript
jquery仿苹果的时间/日期选择效果
2017/03/08 Javascript
Vue学习笔记进阶篇之vue-cli安装及介绍
2017/07/18 Javascript
Vue学习笔记进阶篇之多元素及多组件过渡
2017/07/19 Javascript
nodejs读取本地中文json文件出现乱码解决方法
2018/10/10 NodeJs
vue生命周期的探索
2019/04/03 Javascript
ligerUI的ligerDialog关闭刷新的方法
2019/09/27 Javascript
JS实现简单省市二级联动
2019/11/27 Javascript
Python编程之属性和方法实例详解
2015/05/19 Python
Python 爬虫学习笔记之单线程爬虫
2016/09/21 Python
python书籍信息爬虫实例
2018/03/19 Python
python中字符串变二维数组的实例讲解
2018/04/03 Python
python字符串string的内置方法实例详解
2018/05/14 Python
Python爬虫常用小技巧之设置代理IP
2018/09/13 Python
美国知名的在线旅游服务网站:Priceline
2016/07/23 全球购物
世界著名的顶级牛排:Omaha Steak(奥马哈牛排)
2016/09/20 全球购物
Marlies Dekkers内衣荷兰官方网店:荷兰奢侈内衣品牌
2020/03/27 全球购物
CSMA/CD介质访问控制协议
2015/11/17 面试题
商务邀请函范文
2014/01/14 职场文书
简历中个人自我评价分享
2014/03/15 职场文书
团日活动总结报告
2014/06/25 职场文书
小学运动会报道稿
2014/10/04 职场文书
工作转正自我鉴定范文
2019/06/21 职场文书
导游词之苏州寒山寺
2019/12/05 职场文书
HTTP中的Content-type详解
2022/01/18 HTML / CSS
基于Python实现射击小游戏的制作
2022/04/06 Python
教你win10系统中APPCRASH事件问题解决方法
2022/07/15 数码科技