jQuery / css目标nth-child类

<div class="outercontainer">
 <div class="paddedcontainer">

  <div class="pageheader">
   <div class="titlestyle"><h2>Fixed Title1</h2></div>
  </div>
  <div class="row">
   <div class="grouped">
    <div class="col4">
    Some content
    </div>
   </div>
  </div>

  <div class="pageheader">
   <div class="titlestyle"><h2>Fixed Title2</h2></div>
  </div>
  <div class="row">
  Some other content not in a col4 div
  </div>
  <div class="row">
  Some other content not in a col4 div
  </div>


 </div>
</div>

Hi all, this is my first post here - I apologise for bringing my stupid question to you all but I am having a hard time trying to solve this on my own.

大家好,这是我在这里发表的第一篇文章 - 我为向你提出我的愚蠢问题而道歉,但我很难自己解决这个问题。

I would like to target the div class 'row' that does not have it's content in a col4 div. I have tried using css nth-child but this does not seem to work and I have looked at jQuery .find .has .filter but I always end up targeting the upper most .row or none of the .row

我想在div4 div中定位没有它内容的div类'row'。我尝试过使用css nth-child,但这似乎不起作用,我看了jQuery .find .has .filter但是我总是最终定位于最高.row或者没有.row

I cannot change the html in anyway, all I can use is javascript or css.

无论如何我无法改变html,我可以使用的只是javascript或css。

Please help.

Many thanks, Dazza

非常感谢,Dazza

4 个解决方案

#1

Try

$('.row').not(':has(.col4)')

Demo: Fiddle

.not() : For filtering out matched elements from passed set
:has() : For filtering elements which has elements matching the passed selector

.not():用于从传递的集合中过滤掉匹配的元素:has():用于过滤具有与传递的选择器匹配的元素的元素

#2

Using the :not() and a nested :has():

使用:not()和嵌套:has():

var rows = $('.row:not(:has(.col4))');

Demo

#3

jQuery's :has and the negation :not will in combination work for your purpose:

jQuery的:有和否定:不会为了你的目的而组合起来:

var $filtered = $(".row:not(:has(.col4))");

Example

#4

-1

This could work for your specific example:

这可能适用于您的具体示例:

var rows = $('.row').first().nextAll();

#1

Try

$('.row').not(':has(.col4)')