回到课程

添加关闭按钮

重要程度: 5

有一张消息列表。

使用 JavaScript 在每条消息的右上角都添加一个按钮。

结果应该如下所示:

打开一个任务沙箱。

我们可以使用 position:absolute(使 pane position:relative)或者 float:right 来添加按钮。float:right 的好处是按钮永远都不会重叠文本,但是 position:absolute 有更多的灵活性,选择权在你手上。

然后对于每个 pane 来说,代码都是如此:

pane.insertAdjacentHTML("afterbegin", '<button class="remove-button">[x]</button>');

然后 <button> 变成了 pane.firstChild,因此我们可以像这样为它添加处理器:

pane.firstChild.onclick = () => pane.remove();

使用沙箱打开解决方案。