<!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
>