在迭代無序列表時跳過第一個列表項。 JQuery

我有一個無序的列表，其中列表項包含指向圖像的鏈接。我的代碼當前迭代列表項，獲取href，在div banner-holder內創建一個新的圖像容器並添加src屬性。在迭代無序列表時跳過第一個列表項。 JQuery

我想要做的就是跳過第一個列表項，因爲我已經有banner-holder內的圖像，我不希望添加兩次。

謝謝。

$('li').each(function() 
    { 
     var bigImage = $(this).find('a.main-img').attr('href'); 

     $('<img/>').attr('src', bigImage).appendTo('#banner-holder'); 

    });

來源

2011-12-11 Cecil Theodore

$('ul li').not(':first-child').each(function() 
    { 
     var bigImage = $(this).find('a.main-img').attr('href'); 

     $('<img/>').attr('src', bigImage).appendTo('#banner-holder'); 

    });

來源

2011-12-11 11:21:38 danludwig

jeez，甚至沒想過：第一個孩子。有趣的是，一直在使用該css3選擇器一段時間與selectivizr，並一直在與它的IE問題作鬥爭！非常感謝，真的幫助我！ –

那麼這個工作在IE lt 9中呢？ – danludwig

是的，：第一個孩子被jquery覆蓋在IE的舊版本中工作。爲了解決它，如果你只是使用CSS，你將不得不合並一個selectivizr.js文件，這使舊版IE的行爲像IE9一樣，允許用戶使用css3選擇器。繼承人在哪裏可以找到selectivizr文件http://selectivizr.com/ –

jQuery的each method通過當前項目的索引，所以你可以使用：

$('li').each(function (index) 
{ 
    if (index > 0) { 
     var bigImage = $(this).find('a.main-img').attr('href'); 

     $('<img/>').attr('src', bigImage).appendTo('#banner-holder'); 
    } 
});

或者，你可以用gt selector做到這一點：

$('li:gt(0)').each(function() { 
    ... 
});

當前jQuery documentation有關於gt選擇器的說明：

因爲：GT（）是一個jQuery擴展，而不是CSS 規範的一部分，使用查詢：GT（）不能把由源DOM querySelectorAll（）方法提供的性能提升的優點。爲了在現代瀏覽器中獲得更好的性能，請使用 $（「your-pure-css-selector」）。slice（index）。

來源

2011-12-11 11:21:59 FishBasketGordo

$('li:not(:first-child)').each(function() 
    { 
    var bigImage = $(this).find('a.main-img').attr('href'); 

     $('<img/>').attr('src', bigImage).appendTo('#banner-holder'); 

    });

我沒有測試這一點，但我認爲它會工作。

來源

2011-12-11 11:26:16 Malixxl

在迭代無序列表時跳過第一個列表項。 JQuery

回答

相關問題