什麼是設置if語句來處理document.getElementsByClassName（「class_name」）undefined的正確方法？

Question

var prev = document.getElementsByClassName("swiper-slide swiper-slide-prev"); 
var next = document.getElementsByClassName("swiper-slide swiper-slide-next"); 

alert(prev[0].className===undefined); 

例如：

所以，在那裏我有警報。當document.getElementsByClassName("swiper-slide swiper-slide-prev")沒有找到類名爲swiper-slide swiper-slide-prev的元素時會返回什麼？你如何在if語句中處理這個問題？

Answer 1

您可以簡單地使用該對象的length來檢查選擇器是否找到了某物。

var prev = document.getElementsByClassName("swiper-slide swiper-slide-prev"); 
 
var next = document.getElementsByClassName("swiper-slide swiper-slide-next"); 
 

 
if(!prev.length) { 
 
    alert("no prev"); 
 
} 
 

 
if(!next.length) { 
 
    alert("no next"); 
 
}

<div class="swiper-slide swiper-slide-next"></div>

Answer 2

document.getElementsByClassName返回找到元件的陣列。如果未找到，則爲空。

所以你可以檢查if(prev.length === 0)

順便說一句。你可以在瀏覽器中輕鬆地嘗試這一個。

Answer 3

getElementsByClassName返回一個ARRAY並且您可以知道您是否具有數組長度的元素。這裏是一個例子：

var prev = document.getElementsByClassName("swiper-slide swiper-slide-prev"); 
var next = document.getElementsByClassName("swiper-slide swiper-slide-next"); 

if(prev.length > 0){ 
    alert(prev[0].className); 
} 

顯然這個元素有一個類名，因爲你把它與類名一起使用。

我希望這可以幫助你！

Answer 4

檢查結果數組的長度是一個整潔且易於理解的方法，但如果您關心腳本的大小，可以直接將賦值語句if語句。

if (var prev = document.getElementsByClassName("swiper-slide swiper-slide-prev")) { 
    // Found element(s) 
} 

if (! var next = document.getElementsByClassName("swiper-slide swiper-slide-next")) { 
    // Didn't find any element 
} 

這會在縮小腳本時有所幫助，你會這麼做。