详解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 写的一个简单的timer
Jul 30 Javascript
Javascript attachEvent传递参数的办法
Dec 14 Javascript
jQuery EasyUI API 中文文档 - Draggable 可拖拽
Sep 29 Javascript
javascript 处理null及null值示例
Jun 09 Javascript
如何解决hover在ie6中的兼容性问题
Dec 15 Javascript
从零开始学习Node.js系列教程一:http get和post用法分析
Apr 13 Javascript
vue+axios 前端实现的常用拦截的代码示例
Aug 23 Javascript
vue 项目地址去掉 #的方法
Oct 20 Javascript
javascript设计模式 ? 抽象工厂模式原理与应用实例分析
Apr 09 Javascript
JavaScript this指向相关原理及实例解析
Jul 10 Javascript
vue tab切换,解决echartst图表宽度只有100px的问题
Jul 19 Javascript
关于element的表单组件整理笔记
Feb 05 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
手把手教你使用DedeCms的采集的图文教程
2007/03/11 PHP
PHP 用数组降低程序的时间复杂度
2009/12/04 PHP
php中怎么搜索相关联数组键值及获取之
2013/10/17 PHP
php读取excel文件示例分享(更新修改excel)
2014/02/27 PHP
ThinkPHP中的关联模型注意点
2014/06/16 PHP
解析PHP强制转换类型及远程管理插件的安全隐患
2014/06/30 PHP
改进:论坛UBB代码自动插入方式
2006/12/22 Javascript
XmlUtils JS操作XML工具类
2009/10/01 Javascript
js下用gb2312编码解码实现方法
2009/12/31 Javascript
Javascript常考语句107条收集
2010/03/09 Javascript
jquery dialog键盘事件代码
2010/08/01 Javascript
JS delegate与live浅析
2013/12/21 Javascript
jQuery的DOM操作之删除节点示例
2014/01/03 Javascript
javascript读写json示例
2014/04/11 Javascript
jQuery插件datatables使用教程
2016/04/21 Javascript
WEB前端开发框架Bootstrap3 VS Foundation5
2016/05/16 Javascript
jquery.validate使用详解
2016/06/02 Javascript
JQuery选中select组件被选中的值方法
2018/03/08 jQuery
vue后台管理之动态加载路由的方法
2018/08/13 Javascript
浅谈ng-zorro使用心得
2018/12/03 Javascript
[00:16]热血竞技场
2019/03/06 DOTA
Python与Redis的连接教程
2015/04/22 Python
python3.5实现socket通讯示例(TCP)
2017/02/07 Python
详解Golang 与python中的字符串反转
2017/07/21 Python
tensorflow 恢复指定层与不同层指定不同学习率的方法
2018/07/26 Python
详解Python在使用JSON时需要注意的编码问题
2019/12/06 Python
css实例教程 一款纯css3实现的超炫动画背画特效
2014/11/05 HTML / CSS
玲玲的画教学反思
2014/02/04 职场文书
安全生产责任书
2014/03/12 职场文书
王兆力在市委党的群众路线教育实践活动总结大会上的讲话稿
2014/10/25 职场文书
2014年学生会生活部工作总结
2014/11/07 职场文书
文案策划岗位职责
2015/02/11 职场文书
2015年七年级班主任工作总结
2015/05/21 职场文书
运动会宣传稿50字
2015/07/23 职场文书
Python Socket编程详解
2021/04/25 Python
Go gorilla securecookie库的安装使用详解
2022/08/14 Golang