Javascript 获取CSS过滤器后的背景色

我有一个div，用背景色填充。 使用Javascript，我在div周围使用3个包装器，每个包装器都带有一个过滤器，以友好的方式更改色调、饱和度和亮度过滤器

   <div class="filterHue">
      <div class="filterSaturation">
         <div class="filterLightness">
            <div class="baseColor"></div>
         </div>
      </div>
   </div>

如何在过滤器之后获得

baseColor

div的结果背景色，以便将该颜色应用于多个文本元素

---

我提出的唯一解决方案是以与div相同的方式包装文本元素，但我认为在页面上有太多过滤器是一种过分的做法，如果可能的话，我更喜欢另一种解决方案。

我认为您无法从div中获得计算出的颜色。但是您可以使用javascript计算基础颜色上的过滤器效果。看看这个图书馆-

---

它有一些方法，比如

变轻

，

饱和

和

旋转

，我不这么认为。我想这可能会有帮助。但我认为它没有考虑到背景色的分辨率

以下代码仍然输出：

rgb（0，0，255）

var e=document.querySelectorAll（“div.test”）[0]；
警报（window.getComputedStyle（e，null）[“背景色]）
.test{
显示：内联块；
宽度：50px；
高度：50px；
背景颜色：蓝色；
滤镜：灰度（100%）；
}
那怎么办？另外，请发布你的CSS。这很有效，但是颜色有点不同。（我使用的不是单一颜色，而是渐变色）我完全移除了过滤器，并使用这个库来计算颜色。