html取消选择代码

在 HTML 中，取消已选择的部分是一个非常常见的需求。放心，你不需要重新选择所有内容来取消选中。下面我们就来讨论一下 HTML 中取消选中的代码。

::selection {
  background: none;
  color: inherit;
}

如上所示，`::selection` 伪元素可以用于定制文本被选择时的样式。通过将 `background` 属性设置为 `none`，文本的选中背景色将被取消。而将 `color` 属性设置为 `inherit`，可以保持文本原有的颜色，从而避免在取消选中后出现不一致的样式。

除了 `::selection`，我们还可以通过 JavaScript 来实现取消选中。以下代码演示了如何在输入框中取消当前选中的内容：

document.addEventListener('mouseup',() => {
  if (window.getSelection().type === 'Range') {
    window.getSelection().empty();
  }
});

当选中的文本是一个 `Range` 类型时，我们可以使用 `empty()` 方法来清空当前选中的内容。这样就可以在用户单击页面其他区域时自动取消选中啦。