jquery - 性能 : Ancestor-child type selectors vs. 特定元素类选择器

Question

在大型网站上工作时，出于可访问性原因，您需要将所有段落文本更改为不同的颜色，向正文添加类然后定位元素之间的性能是否存在显着差异，或者该类是否应该直接添加到元素本身，例如

在 CSS LIKE 中将类添加到主体结果

body.style-two p {
 color: blue;
}

在 CSS LIKE 中将类添加到 HTML 元素结果

p.style-two {
 color: blue;
}

我会使用 jquery 添加相关的一个或多个类，所以我想如果您将单个类添加到正文或将多个类添加到目标元素，可能还会出现一些与性能相关的问题。

在更大的网站上，优化绝对是一个问题，所以我想知道解决这个问题的“最佳”方法。

感谢您的宝贵时间和帮助。

Answer 1

我认为如果性能是问题，第一种方法将是处理此问题的最佳方法，因为您会将类添加到一个元素并且只有一个元素，假设您有 1000 个“p”标签，遍历DOM 找到所有 1000 个元素，然后为每个元素添加一个类 VS 以 body 为目标并向其添加一个类。

其余的处理过程是一样的，因为浏览器的引擎必须重新绘制元素颜色以便用户能够看到它。