使用insertBefore，和insertAfter,在指定位置追加与删除元素

插入和删除元素是在JavaScript中经常使用的操作，可以使用insertBefore和insertAfter方法实现。insertBefore方法用于将元素插入到指定元素之前，insertAfter方法用于将元素插入到指定元素之后。

首先，我们需要一个包含父元素和要插入/删除的元素的HTML结构。下面是一个示例：

```html

```

现在，我们可以使用JavaScript来操作这些元素。首先，我们需要获取父元素和要插入/删除的元素。

```javascript

// 获取父元素

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

// 获取要插入/删除的元素

var elementToInsert = document.createElement('div');

elementToInsert.innerHTML = '新元素';

var elementToDelete = document.getElementById('element2');

```

接下来，我们可以使用insertBefore方法将新元素插入到指定元素之前。

```javascript

parent.insertBefore(elementToInsert, elementToDelete);

```

这将把"新元素"插入到"元素2"之前。

然后，我们可以使用insertAfter方法将新元素插入到指定元素之后。由于JavaScript没有内置的insertAfter方法，我们可以使用insertBefore方法和nextSibling属性来实现。

```javascript

parent.insertBefore(elementToInsert, elementToDelete.nextSibling);

```

这将把"新元素"插入到"元素2"之后。

除了插入元素，我们也可以使用removeChild方法删除指定的元素。

```javascript

parent.removeChild(elementToDelete);

```

这将删除"元素2"。

下面是一个完整的示例，演示如何使用insertBefore和insertAfter在指定位置插入和删除元素：

```html

```

希望这个例子能帮助你理解如何使用insertBefore和insertAfter在指定位置插入和删除元素。在实际应用中，你可以根据自己的需求进行相应的调整和扩展。 如果你喜欢我们三七知识分享网站的文章， 欢迎您分享或收藏知识分享网站文章 欢迎您到我们的网站逛逛喔！https://www.37seo.cn/