无法在'CSSStyleDeclaration'上执行'setProperty'：计算这些样式，因此'opacity'属性为只读[duplicate]

Question

此问题已经在这里有了答案：

Changing CSS pseudo-element styles via JavaScript [duplicate]（8个答案）

[3天前关闭。

我正在尝试通过javascript文件设置伪元素css类的属性值。

问题是我得到标题中显示的错误。

还有其他设置方法吗？

css中的代码：

.list {
  display: flex;
  overflow-x: scroll !important;

  &:before {
    content: '';
    background: linear-gradient(90deg, transparent, white 10px);
  }
}

打字稿文件中的代码：

  protected onScroll() {
    const scrollList = document.getElementById('list');
    const list: CSSStyleDeclaration = window.getComputedStyle(document.querySelector('.list'), ':before');
    if (list.scrollWidth - list.scrollLeft === list.offsetWidth) {
      list.setProperty('opacity', '0');
    } else {
      console.log("not set");
    }
  }

Answer 1

代替list.setProperty('opacity', '0')，使用scrollList.style.opacity = "0"或在CSS的opacity选择器中添加.list规则。