详解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 相关文章推荐
document.documentElement &amp;&amp; document.documentElement.scrollTop
Dec 01 Javascript
JavaScript异步编程:异步数据收集的具体方法
Aug 19 Javascript
用javascript删除当前行,添加行(示例代码)
Nov 25 Javascript
node.js中的fs.readFileSync方法使用说明
Dec 15 Javascript
javascript笛卡尔积算法实现方法
Apr 08 Javascript
jquery简单的弹出层浮动层代码
Apr 27 Javascript
基于Bootstrap使用jQuery实现简单可编辑表格
May 04 Javascript
jQuery页面弹出框实现文件上传
Feb 09 Javascript
详解html-webpack-plugin插件(用法总结)
Sep 12 Javascript
jQuery选择器选中最后一个元素,倒数第二个元素操作示例
Dec 10 jQuery
js实现课堂随机点名系统
Nov 21 Javascript
JS实现简单九宫格抽奖
Jun 28 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
很温暖很温暖的Lester Young
2021/03/03 冲泡冲煮
在JavaScript中调用php程序
2009/03/09 PHP
PHP 裁剪图片成固定大小代码方法
2009/09/09 PHP
php生成xml时添加CDATA标签的方法
2014/10/17 PHP
php中的常用魔术方法汇总
2016/02/14 PHP
简单谈谈PHP中的Reload操作
2016/12/12 PHP
Smarty3配置及入门语法
2017/02/22 PHP
tp5框架的增删改查操作示例
2019/10/31 PHP
Javascript 面向对象之重载
2010/05/04 Javascript
关于juqery radio写法的兼容性问题(新老版本jquery)
2010/06/14 Javascript
用JS判断IE版本的代码 超管用!
2011/08/09 Javascript
javascript面向对象包装类Class封装类库剖析
2013/01/24 Javascript
Jquery:ajax实现翻页无刷新功能代码
2013/08/05 Javascript
jquery结合html实现中英文页面切换
2016/11/29 Javascript
d3.js实现立体柱图的方法详解
2017/04/28 Javascript
React从react-router路由上做登陆验证控制的方法
2018/05/10 Javascript
Javascript中弹窗confirm与prompt的区别
2018/10/26 Javascript
webpack4 配置 ssr 环境遇到“document is not defined”
2019/10/24 Javascript
Vue2.4+新增属性.sync、$attrs、$listeners的具体使用
2020/03/08 Javascript
解决vuecli3中img src 的引入问题
2020/08/04 Javascript
python中使用xlrd、xlwt操作excel表格详解
2015/01/29 Python
python实现任意位置文件分割的实例
2018/12/14 Python
Python浮点型(float)运算结果不正确的解决方案
2020/09/22 Python
Python实现FTP文件定时自动下载的步骤
2020/12/19 Python
CSS3之边框多颜色Border-color属性使用示例
2013/10/11 HTML / CSS
YSL圣罗兰美妆官方旗舰店:购买YSL口红
2018/04/16 全球购物
师范生实习的个人自我鉴定
2013/10/20 职场文书
师范教师大学生职业生涯规划范文
2014/01/05 职场文书
经典团队口号大全
2014/06/21 职场文书
人事主管岗位职责说明书
2014/07/30 职场文书
对党的十八届四中全会的期盼
2014/10/17 职场文书
申报优秀教师材料
2014/12/16 职场文书
公司更名通知函
2015/04/24 职场文书
道歉信怎么写
2015/05/12 职场文书
小学生教师节广播稿
2015/08/19 职场文书
opencv 分类白天与夜景视频的方法
2021/06/05 Python