2017-07-25 6 views
1

クラスに要素数が可変のページで作業しています.def-set。いくつかのページでは、それらのうちの60個を持つことができ、他のものでは1にすることができます。ページに3つ以上ある場合はeq(2)に、3未満の場合はeq(1)に追加します。

.def-setクラスの3番目のインスタンスの後に、.editorial-content-feed-replacementという要素を追加することができました。我々が望んでいるものですが、私は.def-setの最初または2番目のインスタンスの後に追加する方法があれば、ページに3未満があるかどうか疑問に思っています。

私の現在のコード:$('.def-set:eq(2)').append('.editorial-content-feed-replacement')

答えて

1

あなたは

let num = $(".def-set").length 

.def-set要素の数を計算して、あなたが望むものを達成するためのif-elseロジックを比較することができます:

if (num >= 3) { 
    $('.def-set:eq(2)').append('.editorial-content-feed-replacement'); 
} else { 
    // This will append it after the last .def-set element 
    $('.def-set').append('.editorial-content-feed-replacement'); 
} 
1

あなたは、長さを使って.defSetの要素の数を得ることができます - 結果に応じてインデックスを1または2に設定します。

次の3項演算子に注意してください。これは、-if(length < 3){index = 1} else {index = 2}と略記しています。

var defSetLength = $('.def-set').length; 
var index; 
defSetLength < 3 ? index = 1 : index = 2; 
$('.def-set:eq(index)').append('.editorial-content-feed-replacement'); 
0

あなたはslice()last()を使用することができます。

$('#list-one li').slice(0,3).last().append(' - Appended content'); 
 
$('#list-two li').slice(0,3).last().append(' - Appended content'); 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<strong>List one</strong> 
 
<ul id="list-one"> 
 
    <li>Item 1</li> 
 
    <li>Item 2</li> 
 
</ul> 
 
<strong>List two</strong> 
 
<ul id="list-two"> 
 
    <li>Item 1</li> 
 
    <li>Item 2</li> 
 
    <li>Item 3</li> 
 
    <li>Item 4</li> 
 
    <li>Item 5</li> 
 
</ul>

:異なる長さの2つのリストを使用して

関連する問題