创造一组没有特定孩子的父母

Question

我有500个<p>个元素，每个元素都有大约500个<span>个元素，其css设置为不透明度1。

如果我$('p').css( 'opacity', .5 )，一切都会立即更新。

如果我$('p span').css( 'opacity', .5 )，则需要几秒钟才能更新。明显。它遍历每个元素。

我的问题是：在不同<span>元素中给定一组任意<p>个元素，是否有一种很好的方法可以使所有内容更改为不透明度.5 ？

我试过了not。 $('p').not( $('p span').slice( 5, 600) ).css( 'opacity', .5 )不起作用 - 可能是因为我正在执行set代数以从父母中移除子项。我希望它会暗中起作用。唉。

有没有一种解决此类问题的好方法？ Here's a fiddle

$('p span').not( $('p span').slice( 5, 600) ).css( 'opacity', .5 )有效......但速度很慢： - /

Answer 1

您可以在jQuery之后直接拨打slice方法：

http://jsfiddle.net/CNU62/10/

$('p span').slice(5, 600).css('opacity', .75);

编辑：

如果你不介意做两个步骤：

http://jsfiddle.net/CNU62/13/

$('p span').slice(10, 20).addClass('filterOut');
$('span').not('.filterOut').css('opacity', .75);

基本上为您切片的跨度添加特殊类，并not用类span取出css()，然后执行{{1}}

Answer 2

我不能保证这会有很多元素，你可以做到这一点：

$("p > *").not("span").css("opacity", 0.5);

这将获取<p>标记的所有子对象，然后在应用不透明度之前从该集合中删除<span>元素。因此，只有<span>元素在<p>标记内不受影响。

仅供参考，如果你需要它表现良好，那么直接走树可能会比这快很多倍。在某些地方，直接JS代码可以比在选择器操作中快得多。

Answer 3

这是我的尝试......仍然很慢。

http://jsfiddle.net/V62wp/5/

var specialSpans = $('p span').slice(5, 105);
$('p').not(specialSpans.parent()).css('opacity', .5);
specialSpans.siblings().not( specialSpans ).css( 'opacity', .5 );

---

这会略微提高速度（参见this fiddle）：

var specialSpans = $('p span').slice(5, 105);
var specialParent = specialSpans.parent();
$('p').not(specialParent).css('opacity', .5);
specialParent.children().not(specialSpans).css('opacity', .5);