---
id: 587d78b3367417b2b2512b11
title: Add Items Using splice()
challengeType: 1
videoUrl: ''
localeTitle: 使用splice（）添加项目
---
## Description
还记得在上一次挑战中我们提到过splice()最多需要三个参数吗？好吧，我们可以更进一步使用splice() - 除了删除元素之外，我们还可以使用代表一个或多个元素的第三个参数来添加它们。这对于快速切换另一个元素或一组元素非常有用。例如，假设您正在为数组中的一组DOM元素存储颜色方案，并希望根据某些操作动态更改颜色： function colorChange（arr，index，newColor）{
arr.splice（index，1，newColor）;
返回
}
让colorScheme = ['＃878787'，'＃a08794'，'＃bb7e8c'，'＃c9b6be'，'＃d1becf'];
colorScheme = colorChange（colorScheme，2，'＃332327'）;
//我们删除了'＃bb7e8c'并在其位置添加了'＃332327'
// colorScheme现在等于['＃878787'，'＃a08794'，'＃332327'，'＃c9b6be'，'＃d1becf']
此函数采用十六进制值数组，删除元素的索引以及用于替换已删除元素的新颜色。返回值是一个包含新修改的颜色方案的数组！虽然这个例子有点过于简单，但我们可以看到利用splice()到其最大潜力的值。
## Instructions
我们定义了一个函数htmlColorNames ，它将一组HTML颜色作为参数。使用splice()修改函数以删除数组的前两个元素，并在各自的位置添加'DarkSalmon'和'BlanchedAlmond' 'DarkSalmon' 。
## Tests
```yml
tests:
- text: 'htmlColorNames应该返回["DarkSalmon", "BlanchedAlmond", "LavenderBlush", "PaleTurqoise", "FireBrick"]'
testString: 'assert.deepEqual(htmlColorNames(["DarkGoldenRod", "WhiteSmoke", "LavenderBlush", "PaleTurqoise", "FireBrick"]), ["DarkSalmon", "BlanchedAlmond", "LavenderBlush", "PaleTurqoise", "FireBrick"], "htmlColorNames should return ["DarkSalmon", "BlanchedAlmond", "LavenderBlush", "PaleTurqoise", "FireBrick"]");'
- text: htmlColorNames函数应该使用splice()方法
testString: 'assert(/.splice/.test(code), "The htmlColorNames function should utilize the splice() method");'
- text: 你不应该使用shift()或unshift() 。
testString: 'assert(!/shift|unshift/.test(code), "You should not use shift() or unshift().");'
- text: 您不应该使用数组括号表示法。
testString: 'assert(!/\[\d\]\s*=/.test(code), "You should not use array bracket notation.");'
```
## Challenge Seed
```js
function htmlColorNames(arr) {
// change code below this line
// change code above this line
return arr;
}
// do not change code below this line
console.log(htmlColorNames(['DarkGoldenRod', 'WhiteSmoke', 'LavenderBlush', 'PaleTurqoise', 'FireBrick']));
```
## Solution
```js
// solution required
```