【问题标题】:Is it possible to get multi pseudo-element to using javascript?是否可以使用 javascript 获得多个伪元素?
【发布时间】:2020-06-29 20:08:22
【问题描述】:

其实,我想获取多个伪元素来使用 querySelectorAll。

我阅读了一些相关的文章,那里的所有开发人员都说我们没有权限使用 querySelectorAll 来获取多个伪元素。

我们可以只使用一个元素来使用 querySelector 和下面的代码。

const textAfter = window.getComputedStyle(
document.querySelector(".text-after"), ":after"
).getPropertyValue("color")
console.log(textAfter)

但有时我们的项目目的需要使用多个选择器。 所以,这就是为什么有人在这里体验过?谁能帮忙解决这个问题?

感谢@All

【问题讨论】:

    标签: javascript css pseudo-element selectors-api


    【解决方案1】:

    颠倒顺序。与其尝试计算元素列表的属性,不如为列表中的每个元素计算每个元素的属性:

    const elements = Array.from(document.querySelectorAll(`.text-after`));
    
    const allOfThem = elements.map(element => 
      window.getComputedStyle(element, ":after").getPropertyValue("color")
    );
    
    console.log(allOfThem);
    

    (我们在这里使用Array.from,因为虽然HTMLCollection 带有.forEach,但它确实没有带有.map,所以我们需要在我们这样做之前强制它成为一个真正的数组我们的映射)

    【讨论】:

      猜你喜欢
      • 2013-07-25
      • 2021-06-04
      • 1970-01-01
      • 2012-10-11
      • 1970-01-01
      • 2012-06-25
      • 2017-01-31
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多