详解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 相关文章推荐
用htc组件制作windows选项卡
Jan 13 Javascript
html 锁定页面(js遮罩层弹出div效果)
Oct 27 Javascript
关于js遍历表格的实例
Jul 10 Javascript
向左滚动文字 js代码效果
Aug 17 Javascript
JavaScript实现数组在指定位置插入若干元素的方法
Apr 06 Javascript
gameboy网页闯关游戏(riddle webgame)--仿微信聊天的前端页面设计和难点
Feb 21 Javascript
JS生成某个范围的随机数【四种情况详解】
Apr 20 Javascript
详解vue服务端渲染(SSR)初探
Jun 19 Javascript
VsCode新建VueJs项目的详细步骤
Sep 23 Javascript
vue指令只能输入正数并且只能输入一个小数点的方法
Jun 08 Javascript
Vue自定义全局Toast和Loading的实例详解
Apr 18 Javascript
基于Vue+ElementUI的省市区地址选择通用组件
Nov 20 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 多维数组排序实现代码
2009/08/05 PHP
基于php权限分配的实现代码
2013/04/28 PHP
jQuery 1.5最新版本的改进细节分析
2011/01/19 Javascript
基于IE下ul li 互相嵌套时的bug,排查,解决过程以及心得介绍
2013/05/07 Javascript
Jquery加载时从后台读取数据绑定到dropdownList实例
2013/06/09 Javascript
jquery ajax修改全局变量示例代码
2013/11/08 Javascript
AngularJS + Node.js + MongoDB开发的基于高德地图位置的通讯录
2015/01/02 Javascript
基于jquery实现百度新闻导航菜单滑动动画
2016/03/15 Javascript
jq给页面添加覆盖层遮罩的实例
2017/02/16 Javascript
用node和express连接mysql实现登录注册的实现代码
2017/07/05 Javascript
微信小程序项目总结之点赞 删除列表 分享功能
2018/06/25 Javascript
使用electron制作满屏心特效的示例代码
2018/11/27 Javascript
vue全局自定义指令-元素拖拽的实现代码
2019/04/14 Javascript
python连接mongodb操作数据示例(mongodb数据库配置类)
2013/12/31 Python
Python三元运算实现方法
2015/01/12 Python
Linux环境下MySQL-python安装过程分享
2015/02/02 Python
Python编写生成验证码的脚本的教程
2015/05/04 Python
Django框架中render_to_response()函数的使用方法
2015/07/16 Python
python PIL模块与随机生成中文验证码
2016/02/27 Python
Python Socket实现简单TCP Server/client功能示例
2017/08/05 Python
Python简单实现阿拉伯数字和罗马数字的互相转换功能示例
2018/04/17 Python
python 中的列表生成式、生成器表达式、模块导入
2019/06/19 Python
python3 打印输出字典中特定的某个key的方法示例
2019/07/06 Python
如何在Django配置文件里配置session链接
2019/08/06 Python
基于Python执行dos命令并获取输出的结果
2019/12/30 Python
python 连续不等式语法糖实例
2020/04/15 Python
html5 input属性使用示例
2013/06/28 HTML / CSS
亚历山大·王官网:Alexander Wang
2017/06/23 全球购物
Nike比利时官网:Nike.com (BE)
2019/02/07 全球购物
德国网上超市:myTime.de
2019/08/26 全球购物
一加手机美国官方网站:OnePlus美国
2019/09/19 全球购物
秋季运动会加油稿200字
2014/01/11 职场文书
运动会入场解说词
2014/02/07 职场文书
经销商订货会主持词
2014/03/27 职场文书
居安思危观后感
2015/06/11 职场文书
zabbix自定义监控nginx状态实现过程
2021/11/01 Servers