他の要素内のdivを選択するには、nth-childにはどのような選択肢がありますか？

Question

私は<nav>のようなHTML構造を持っています。 ：：遅延

.primary-nav:nth-child(n) { 
    transition-delay: 400ms; 
} 
.primary-nav:nth-child(2n) { 
    transition-delay: 400ms; 
} 
.primary-nav:nth-child(3n) { 
    transition-delay: 700ms; 
} 
.primary-nav:nth-child(4n) { 
    transition-delay: 700ms; 
} 
.primary-nav:nth-child(5n) { 
    transition-delay: 900ms; 
} 
/* and so on */ 

MDN後に変換

<nav> 
    <article class="menu-items"> 
    <div class="row"> 
     <ul class="col-6 column"> 
     <!-- primary nav group one --> 
     <li class="primary-nav">Home</li> 
     <li class="primary-nav">News</li> 
     </ul> 
     <ul class="col-6 column right align-right"> 
     <!-- primary nav group two --> 
     <li class="primary-nav">About</li> 
     <li class="primary-nav">Contact</li> 
     </ul> 
    </div> 
    <div class="row"> 
     <!-- primary nav group three --> 
     <h1 class="primary-nav">Connect Online</h1> 
     <ul class="col-6 column submenu-items"> 
     <li class="primary-nav"><a href="/">Twitter</a></li> 
     <li class="primary-nav"><a href="/">Instagram</a></li> 
     </ul> 
     <ul class="col-6 column right submenu-items align-right"> 
     <!-- primary nav group four --> 
     <li class="primary-nav"><a href="/">Facebook</a></li> 
     <li class="primary-nav"><a href="/">Sq</a></li> 
     </ul> 
    </div> 
    </article> 
</nav> 

そして、いくつかのCSSをトリガするために：私はnth-childが移動するための方法だったと仮定n番目の子（）CSSの擬似クラスは1と一致しました以上の要素は、primary-navがdiffe間にあるので、私はここにnth-childを使用することはできません

兄弟のグループの中で自分の位置に基づいて、家賃グループ。最初のグループの終わりに達すると、それは再始動します。意味をなさない(odd)または(even)はここでもあまり使用されません。

.primary-nav divはどのようにタグ付けできますか？私はJSなしでそれをすることはできますか？

Answer 1

私はあなたに適したソリューションであるかどうかはわかりませんが、Jqueryでこれを行うことができると思います。

var navDivs = $(".your-class-name").find(".primary-nav"); //Gives the list of divs who have the class .primary-nav. 

それとも、あなたはあなたのdivにIDを与えるとIDでループのためにあなたはjQueryので項目のいずれかのプロパティを設定することができますすることによって

var navDivs = $("#your-parent-div-id").find(".primary-nav"); //Gives the list of divs who have the class .primary-nav. 

し、最終的に検索することができます。

for (var i = 0; i < navDivs.length; i++) { 
    var div = navDivs[i]; 
    $(div).css("your-css-property", "your-css-value"); 
}