javascript – 许多选择器和添加类

2023年6月8日 158次阅读

我正在使用jQuery来处理IE7和IE中不支持的选择器. 8(主要是：nth-​​child和：last-child).我已经读过addClass比使用jQuery的css方法更高效,所以我正在重构我的JS来做到这一点.

将同一个类添加到多个(有时很多！)不同选择器的最佳方法是什么？将它们全部放入同一语句并在列表末尾使用addClass是否安全？

例如：

$('.selector1:nth-child(3),
   .diff-selector2:last-child,
   #another-selector:nth-child(2),
   tr.highlighted td:last-child,
   h2.job-title:last-child').addClass('fallback-class');

是否存在选择器列表变慢的限制或点？我应该为那些选择器列表创建变量吗？有更好的方法吗？

最后说明：不幸的是,使用Selectivizr让IE7陷入停顿.这就是我决定使用上述方法的原因.

最佳答案 我想到了两种方式

1)你可以为你的元素设置一个公共类,并为它们添加一个类

<p class="addThis">1</p>
<p>2</p>
<span class="addThis">3</span>
<a>4</a>
<p>5</p>
<a class="addThis">6</a>

$('.addThis').addClass('fallback-class'); //1,3,6 will be added classes

2)你可以使用父/子方法

<p>
    <a>1</a>
    <span>2</span><!-- wont be added class -->
</p>
<p>
    <a>3</a>
</p>
<a>3</a><!-- wont be added class -->
<p>4</p><!-- wont be added class -->

$('p').children('a').addClass('fallback-class');
//this will adds class which got "a" selector inside "p"

$('a').parent('p').addClass('fallback-class');
//this will adds class "p" selector which got children "a"
点赞