如何在使用 javascript 之前选择和操作带有伪元素的特定 <li> 元素，例如 ::marker、::before答案

【问题标题】：How to select and manipulate specific <li> elements present with pseudo-elements such as ::marker, ::before using javascript如何在使用 javascript 之前选择和操作带有伪元素的特定 <li> 元素，例如 ::marker、::before
【发布时间】：2022-04-28 10:58:27
【问题描述】：

我正在寻找一种方法来使用 Javascript 访问带有伪元素（例如 ::before 和 ::marker）的 <li> 元素。到目前为止，我无法为那些<li> 元素编写一个唯一的选择器，它只能突出显示那些与::before 或::marker 一起出现的元素。任何想法都会很棒。

document.querySelectorAll('div.simple-description"] li').forEach((li) => {
  if ((li.querySelector('li'), 'marker') === "marker") {
    li.setAttribute('bullet', "true")
  }
})

<div class="simple-description">
  <p>Sample data Sample data Sample data Sample data</p>
  <li>Without marker</li>
  <li>::marker DATA with ::marker</li>
  <li>::marker Want to access this</li>
  <li>::before Data with ::before</li>
</div>

试一试的示例网址：https://www.windeln.de/aussie-spuelung-repair-miracle.html

【问题讨论】：

这有帮助吗？ stackoverflow.com/questions/5041494/…
伪元素在 DOM 中不存在，因此通过它们进行过滤非常困难（假设它是可能的），而且 jQuery 不能开箱即用。你很可能需要编写一些原生 JS 来为你做这件事。如果您能告诉我们您的目标，那么可能有一种更简单的方法可以实现您需要做的任何事情。
可能重复：stackoverflow.com/q/58001666/8620333
@RoryMcCrossan 我们可以按伪元素过滤 ^ 但我认为标记不是这种情况
@TemaniAfif 你是对的，我应该更具体一点，我指的是::marker

标签： javascript html jquery css css-selectors

【解决方案1】：

无法通过选择器获取，只能遍历 ol 并获取 li 类型

$("ol").each(function() {
                    
    var thisType = $(this).attr("type"); //get type
    
    if (thisType == "1" || thisType == "a") { //filter by what type
        $(this).find('li'); //your element
    }
    
});

【讨论】：