javascript - querySelectorAll - 我可以放置一个带有 ":after"的选择器吗？

Question

我可以在 JavaScript 中执行此操作吗？

var Dim_Back = document.querySelectorAll(".s1:after");
for (var i = 0; i < Dim_Back.length; i++) {
                Dim_Back[i].style.backgroundImage = "url(" + imgSrc + ")";
            }

.view .s1:after {
                position: absolute;
                bottom: 0;
                top: 0;
                right: 0;
                left: 0;
                content: '';
                display: block;
                opacity: 0;
                transition-delay: 0.3s;
            }

            .view:hover .s1:after {
                opacity: 1;
                transition-delay: 0.7s;
            }

我还从我的 CSS 代码中提取了一部分。

我想知道是否可以将“:after”放在 querySelectorAll 中。它会保持 s1 属性吗？

Answer 1

好吧，如果您使用的是(相对)现代的浏览器，那么 - 是的，您可以!

const myElement = document.querySelector('your-element-selector')
const myPseudoElement = window.getComputedStyle(myElement, ':after')

然后您可以使用 getPropertyValue 来检索 css 值。例如:

const originalBackgroundValue = myPseudoElement.getPropertyValue('background-color')

您可以阅读更多相关信息 here

如果您还想更新值，请使用此 answer