登录  /  注册
博主信息
博文 15
粉丝 0
评论 1
访问量 17364
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
js数组的常用函数slice和splice(1月16号作业)
空城的博客
原创
1042人浏览过

本篇将介绍js中两个常用的数组函数

实例

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

<!DOCTYPE html>

<html lang="en">

 

<head>

    <meta charset="UTF-8">

    <title> js数组的常用函数slice和splice</title>

 

</head>

 

<body>

    <h1>数组演示</h1>

    <ul id="show">

 

    </ul>

    <label for="bian">分割数组前两个成为一个数组:</label>

    <button id="bian" onclick="bian()">slice(0,2)</button><br />

    <label for="bian2">把数组前两个元素删除:</label>

    <button id="bian2" onclick="bian2()">splice(0,2)</button><br/>

    <label for="bian3">在数组第二个位置加两个元素:</label>

    <button id="bian3" onclick="bian3()">splice(1,0,'玮柏','大宽面')</button>

 

</body>

<script>

    var arr = ['jony j', 'gai', '黄旭', 'hotdog'];

    var show = document.getElementById('show');

    arr.forEach(function (v, k) { //此处的k v和php的反过来

 

        var li = document.createElement("li");

        li.innerHTML = v;

        show.appendChild(li);

    })

 

    function bian() {

        while (show.hasChildNodes()) { //删除所有子节点

 

            show.removeChild(show.firstChild);

 

        }

        // 1、slice函数 用于从数组中截取新的数组 传入两个参数 start和end 其中start参数是必须的,end参数可以不给 不给的时候默认从start位置到最后一个元素 传入end参数则从start到end 如果end是负数 则是截取start位置到倒数第几个 此函数包含起点不包含终点

        var arr2 = arr.slice(0, 2);

        arr2.forEach(function (v, k) { //此处的k v和php的反过来

 

            var li = document.createElement("li");

            li.innerHTML = v;

            show.appendChild(li);

 

        });

    }

 

    function bian2() {

        while (show.hasChildNodes()) { //删除所有子节点

 

            show.removeChild(show.firstChild);

 

        }

        // 2、splice函数 是用于在原来的数组上增删的函数(会改变数组本身而不是传入一个新的数组) 传入三个参数 第一个参数index必须传入 代表从何处进行增删 第二个参数代表删除多少元素,如果是0就不删除 第三个参数可选且可以传多个 是需要插入的元素

        arr.splice(0, 2);

        arr.forEach(function (v, k) { //此处的k v和php的反过来

 

            var li = document.createElement("li");

            li.innerHTML = v;

            show.appendChild(li);

 

        });

 

 

    }

 

    function bian3() {

        while (show.hasChildNodes()) { //删除所有子节点

 

            show.removeChild(show.firstChild);

 

        }

 

        arr.splice(1,0,'玮柏','大宽面');

        arr.forEach(function (v, k) { //此处的k v和php的反过来

 

            var li = document.createElement("li");

            li.innerHTML = v;

            show.appendChild(li);

 

        });

 

    }

</script>

 

</html>


运行实例 »

点击 "运行实例" 按钮查看在线实例


批改状态:未批改

老师批语:
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学