详解js删除数组中的指定元素


Posted in Javascript onOctober 31, 2018

本篇文章将会给大家介绍两种删除数组中的指定元素的方式,分别为:

1、单独定义一个的函数,通过函数来删除指定数组元素。

2、为Array对象定义了一个removeByValue的方法,在调用方法来删除指定数组元素,调用非常简单的。

下面我们通过简单的代码示例来简单介绍这两种删除数组指定元素的方式。

1、定义单独的函数removeByValue来进行元素删除

代码示例:删除数组somearray里的"tue"元素

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
 </head>
 
 <body>
  <div class="demo">
   <p>数组:mon, tue, wed, thur</p>
   <p class="p"></p>
 
  </div>
 
 </body>
 
 <script type="text/javascript">
  function removeByValue(arr, val) {
   for(var i = 0; i < arr.length; i++) {
    if(arr[i] == val) {
     arr.splice(i, 1);
     break;
    }
   }
  }
  var somearray = ["mon", "tue", "wed", "thur"]
  removeByValue(somearray, "tue");
  //somearray will now have "mon", "wed", "thur"
 
  document.write("<p>新数组:" + somearray + "</p>");
 </script>
 
</html>

效果图:

详解js删除数组中的指定元素

2、定义并调用数组的removeByValue方法来删除指定元素

代码示例:删除数组somearray里的"wed"元素

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
  </head>
  <body>
    <div class="demo">
      <p>数组:mon, tue, wed, thur</p>
      <p>删除指定元素"tue"后:</p>
    </div>
  </body>
  <script type="text/javascript">
    Array.prototype.removeByValue = function(val) {
      for(var i = 0; i < this.length; i++) {
        if(this[i] == val) {
          this.splice(i, 1);
          break;
        }
      }
    }
    var somearray = ["mon", "tue", "wed", "thur"]
    somearray.removeByValue("wed");
    //somearray will now have "mon", "wed", "thur"
 
    document.write("<p>新数组:" + somearray + "</p>");
  </script>
 
</html>

效果图:

详解js删除数组中的指定元素

总结:以上就是本篇文章所介绍的js删除数组指定元素的两种方式,大家可以自己动手试试,加深理解,希望能对大家的学习有所帮助。

Javascript 相关文章推荐
javascript 数组学习资料收集
Apr 11 Javascript
jQuery1.6 使用方法一
Nov 23 Javascript
找出字符串中出现次数最多的字母和出现次数精简版
Nov 07 Javascript
用json方式实现在 js 中建立一个map
May 02 Javascript
JavaScript中定义函数的三种方法
Mar 12 Javascript
举例讲解如何判断JavaScript中对象的类型
Apr 22 Javascript
3kb jQuery代码搞定各种树形选择的实现方法
Jun 10 Javascript
使用vue编写一个点击数字计时小游戏
Aug 31 Javascript
详解vue-property-decorator使用手册
Jul 29 Javascript
详解Vue之事件处理
Jul 10 Javascript
微信小程序实现可拖动悬浮图标(包括按钮角标的实现)
Dec 29 Javascript
Vue全家桶入门基础教程
May 14 Vue.js
Vue中使用方法、计算属性或观察者的方法实例详解
Oct 31 #Javascript
Vue项目History模式404问题解决方法
Oct 31 #Javascript
Vue.js中对css的操作(修改)具体方式详解
Oct 30 #Javascript
vue组件中的样式属性scoped实例详解
Oct 30 #Javascript
node上的redis调用优化示例详解
Oct 30 #Javascript
elementUI 设置input的只读或禁用的方法
Oct 30 #Javascript
Vue.js 父子组件通信的十种方式
Oct 30 #Javascript
You might like
用PHP和ACCESS写聊天室(八)
2006/10/09 PHP
PHP 读取文件的正确方法
2009/04/29 PHP
popdiv
2006/07/14 Javascript
AJAX的跨域与JSONP(为文章自动添加短址的功能)
2010/01/17 Javascript
基于jquery的网页SELECT下拉框美化代码
2010/10/28 Javascript
jquery随机展示头像代码
2011/12/21 Javascript
jquery实现鼠标悬浮停止轮播特效
2020/08/20 Javascript
Hallo.js基于jQuery UI所见即所得的Web编辑器
2016/01/26 Javascript
jQuery图片轮播插件——前端开发必看
2016/05/31 Javascript
解决Window10系统下Node安装报错的问题分析
2016/12/13 Javascript
js实现移动端微信页面禁止字体放大
2017/02/16 Javascript
BootStrap与Select2使用小结
2017/02/17 Javascript
JS中的三个循环小结
2017/06/20 Javascript
最全的JavaScript开发工具列表 总有一款适合你
2017/06/29 Javascript
vue2.0的contextmenu右键弹出菜单的实例代码
2017/07/24 Javascript
百度地图去掉marker覆盖物或者去掉maker的label文字方法
2018/01/26 Javascript
使用Vue.js开发微信小程序开源框架mpvue解析
2018/03/20 Javascript
vue总线机制(bus)知识点详解
2020/05/10 Javascript
Vue自动构建发布脚本的方法示例
2020/07/24 Javascript
在vue项目中引用Antv G2,以饼图为例讲解
2020/10/28 Javascript
Echarts在Taro微信小程序开发中的踩坑记录
2020/11/09 Javascript
python网络编程学习笔记(八):XML生成与解析(DOM、ElementTree)
2014/06/09 Python
Python中使用Flask、MongoDB搭建简易图片服务器
2015/02/04 Python
Python三级目录展示的实现方法
2016/09/28 Python
python 在屏幕上逐字显示一行字的实例
2018/12/24 Python
Python使用字典实现的简单记事本功能示例
2019/08/15 Python
Django视图扩展类知识点详解
2019/10/25 Python
python向图片里添加文字
2019/11/26 Python
Python 找出出现次数超过数组长度一半的元素实例
2020/05/11 Python
Python容器类型公共方法总结
2020/08/19 Python
css3实现背景颜色渐变让图片不再是唯一的实现方式
2012/12/18 HTML / CSS
如何让pre和textarea等HTML元素去掉滚动条自动换行自适应文本内容高度
2019/08/01 HTML / CSS
数控专业应届生求职信
2013/11/27 职场文书
2014年高三毕业生自我评价
2014/01/11 职场文书
企业法人代表任命书
2014/06/06 职场文书
2015年领导干部廉洁自律工作总结
2015/05/26 职场文书