详解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 相关文章推荐
event对象的方法 兼容多浏览器
Jun 27 Javascript
Raphael带文本标签可拖动的图形实现代码
Feb 20 Javascript
javascript定义变量时加var与不加var的区别
Dec 22 Javascript
JS实现仿腾讯微博无刷新删除微博效果代码
Oct 16 Javascript
jquery validate.js表单验证入门实例(附源码)
Nov 10 Javascript
AngularJS实现表单手动验证和表单自动验证
Dec 09 Javascript
AngularJS打开页面隐藏显示表达式用法示例
Dec 25 Javascript
vue2.0中vue-cli实现全选、单选计算总价格的实例代码
Jul 18 Javascript
bootstrap时间插件daterangepicker使用详解
Oct 19 Javascript
video.js 实现视频只能后退不能快进的思路详解
Aug 09 Javascript
vue 实现在同一界面实现组件的动态添加和删除功能
Jun 16 Javascript
js实现限定范围拖拽的示例
Oct 26 Javascript
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 XML备份Mysql数据库
2009/05/27 PHP
简单PHP上传图片、删除图片实现代码
2010/05/12 PHP
yii2的restful api路由实例详解
2019/05/14 PHP
JavaScript 数组的 uniq 方法
2008/01/23 Javascript
基于jQuery的公告无限循环滚动实现代码
2012/05/11 Javascript
js修改input的type属性及浏览器兼容问题探讨与解决
2013/01/23 Javascript
JS JSON对象转为字符串的简单实现方法
2013/11/18 Javascript
深入分析下javascript中的[]()+!
2015/07/07 Javascript
JavaScript的设计模式经典之建造者模式
2016/02/24 Javascript
利用jquery给指定的table动态添加一行、删除一行的方法
2016/10/12 Javascript
Vue.js 和 MVVM 的注意事项
2016/11/07 Javascript
JS实现的系统调色板完整实例
2016/12/21 Javascript
Angular.js组件之input mask对input输入进行格式化详解
2017/07/10 Javascript
JavaScript实现单击网页任意位置打开新窗口与关闭窗口的方法
2017/09/21 Javascript
Vue 自定义动态组件实例详解
2018/03/28 Javascript
微信小程序使用map组件实现路线规划功能示例
2019/01/22 Javascript
关于Layui Table隐藏列问题
2019/09/16 Javascript
通过滑动翻页效果实现和移动端click事件问题
2021/01/26 Javascript
[48:37]EG vs OG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
[01:32:22]DOTA2-DPC中国联赛 正赛 Ehome vs VG BO3 第一场 2月5日
2021/03/11 DOTA
DJANGO-ALLAUTH社交用户系统的安装配置
2014/11/18 Python
在CentOS6上安装Python2.7的解决方法
2018/01/09 Python
攻击者是如何将PHP Phar包伪装成图像以绕过文件类型检测的(推荐)
2018/10/11 Python
Python基础学习之类与实例基本用法与注意事项详解
2019/06/17 Python
Django使用消息提示简单的弹出个对话框实例
2019/11/15 Python
Tensorflow中tf.ConfigProto()的用法详解
2020/02/06 Python
python爬取2021猫眼票房字体加密实例
2021/02/19 Python
临床医学大学生求职信
2013/09/28 职场文书
家电业务员岗位职责
2014/03/10 职场文书
《小猪家的桃花树》教学反思
2014/04/11 职场文书
《白鹅》教学反思
2014/04/13 职场文书
竞选班干部演讲稿
2014/04/24 职场文书
英语教师求职信
2014/06/16 职场文书
中学教师教学工作总结
2015/08/13 职场文书
2016年大学迎新晚会工作总结
2015/10/15 职场文书
检讨书怎么写?
2019/06/21 职场文书