基於不存在的元素的斷開循環

我已經構建了一個cms，允許用戶將最多10張圖像添加到幻燈片中，所有這些都在前端以div格式輸出，並帶有showcaseSlide的ID最後，例如showcaseSlide0，showcaseSlide1等。對於控制幻燈片顯示的javascript，我需要將所有的div id輸出到數組中，但在幻燈片播放結束時結束數組，例如，如果div id從showcaseSlide0 - showcaseSlide3中去掉了，我需要數組要從幻燈片[0] - 幻燈片[3]中移出。基於不存在的元素的斷開循環

下面是當前的代碼和一些註釋掉的代碼，我有嘗試過：

var slides = new Array(); 
var count = 0; 
for(i=0; i<=10; i++){ 
slides[i] = "showcaseSlide"+i; 
document.write(slides[i]); //so that I can see which id's are in the array 
var div = document.getElementById(slides[i]); 
//if(div) { break; } <- doesn't break 
//if(document.getElementById(slides[i]) == null) break; <-breaks after 1st 
//if(document.getElementById(slides[i]) == undefined) break; <- breaks after 1st 
};

編輯：

我發現了（感謝Teemu誰下面評論），它沒有工作，因爲它在頁面加載之前被調用，因此在對象被渲染之前被調用。我還要感謝Peter Kelly（他也在下面發表了評論），他指出我需要使用！在我打破陳述和弗雷澤誰指出我的循環太大了。

下面是新的代碼（包括正開始功能的其它元件）：

var count = 0; 
var wait = 4000; 
var slides = []; 

function startShowcase() { 

    for(var i=0; i<10; i++){ 
     slides[i] = "showcaseSlide"+i;; 
     if(!document.getElementById(slides[i])) { break; } 
    }; 
    setInterval(showcase, wait); 

};

來源

2012-03-07 Phil Young

如果（！div） – 2012-03-07 12:56:44

*「break after 1st」，那麼你試過嗎？*：然後ID爲'showcaseSlide0'的元素不存在。測試本身是正確的（儘管過於冗長）。 – 2012-03-07 12:57:17

我試過如果（！div）（在第一個之後中斷）和document.getElementById（幻燈片[count]）在控制幻燈片顯示的函數中起作用（count是一個計數器，當我們到達數組末尾時重置）。 – 2012-03-07 13:02:50

我不會如此複雜。我想你有一個班級適用於所有幻燈片的div？如果這樣做，使用類似以下內容：

var slides = [] 
var divs = document.getElementsByClassName('slide-class') 
for (var i = 0, l = divs.length; i < l; ++i) { 
    slides.push("showcaseSlide" + i) 
}

順便說一句，有一些評論對你的代碼：

不要使用new Array()。相反，使用[]。瞭解原因，請參閱here。
您沒有使用var關鍵字來聲明您的i變量，這意味着此變量是全局變量。全球是邪惡的。
document.write是邪惡的。

我猜你的count變量後來有些用處？

來源

2012-03-07 13:02:17

請注意'getElementsByClassName'在IE8及以下版本中不可用。 – 2012-03-07 13:17:25

@FlorianMargaine如果您正確使用它（創建一個全新的文檔），那麼'document.write'不是邪惡的。與DOM操作相比，這是非常快的。顯然它不適合OP的代碼。 – Teemu 2012-03-07 13:18:26

感謝您的指點:)。是的，計數器是控制哪個幻燈片應用效果以及何時重置爲開始的計數器。 – 2012-03-07 13:53:59

您的DIV編號爲0-9，但循環運行了11次。

不是實際的代碼，但是這解釋了它。

for(i=0; i<=10; i++){ 
    0 = 1st 
    1 = 2nd 
    2 = 3rd 
    3 = 4th 
    4 = 5th 
    5 = 6th 
    6 = 7th 
    7 = 8th 
    8 = 9th 
    9 = 10th 
    10 = 11th 
}

來源

2012-03-07 13:11:27 Fraser

基於不存在的元素的斷開循環

回答

相關問題