Vanilla Javascript 可以嵌套 CSS 选择器吗？

Question

嵌套 CSS 在 LESS、SASS、Stylus 等 CSS 预处理器中是一个非常棒的功能。但是 SASS 依赖 Ruby，而 LESS 和 Stylus 需要 Node。由于一些限制，我既不能使用 Node，也不能使用 Ruby 或任何 javascript 库。但我非常需要嵌套功能，这样我就可以节省时间，但我不能有依赖关系。我在想 Vanilla Javascript 是否可以完成我的工作。我假设是这样的：

输入：

 body {
     h1 {
        color: blue;
        &:hover {
            color: red;
        }
  }

输出：

 body h1 {
    color: blue;
 }
 body h1:hover {
    color: red;
 }

那么，这可以用 Vanilla Javascript 实现吗？ （ES6 或 ES6+ 没问题）如果是，请教我如何做。如果没有我能做什么？

Answer 1

原生 CSS 嵌套是 2023 基线的一部分，现在可在大多数主要浏览器上使用。当前的实现与 SCSS 相当接近，但有一些细微的差别。