If/else語句顯示/隱藏圖像

該函數應該如下所示：如果核心模塊提供的變量的整數值大於0，則應顯示圖像，否則應保持隱藏狀態。If/else語句顯示/隱藏圖像

Coremodule是如此構建的，如果我在我的*.js文件中寫入： data.truck.retarderBrake（它是一個整數）。然後核心模塊將返回當前的integervalue。

所以我的「僞代碼」將會是這個樣子：

if (data.truck.retarderBrake>0) { 
    show.image ('images/RetarderON.png'); 
    } else { 
    hide.image ('images/RetarderON.png'); 
}

在我的HTML代碼，我對圖像的語句：

<div class="RetarderOn"></div>

和CSS是這樣的：

.RetarderOn { 
    background-image: url("images/RetarderON.png"); 
    position: absolute; 
    left: 851px; 
    top: 13px; 
    width: 92px; 
    height: 71px; 
    visibility: hidden; 
}

我可以這樣做嗎？那麼JS if語句的正確語法是什麼。也許我可以在JS文件而不是CSS文件中定義圖像的所有屬性？

來源

2017-08-07 Michael Christiansen

您可以通過其style對象爲該特定元素設置visibility屬性;您可以通過querySelector找到元素（如果我只承擔有其中之一），它接受任何有效的CSS選擇器和返回的第一個匹配：

document.querySelector(".RetarderOn").style.visibility = data.truck.retarderBrake > 0 ? "visible" : "hidden";

如果有多個匹配，使用querySelectorAll並選擇相關的一個從得到的NodeList。

來源

2017-08-07 12:03:42

If/else語句顯示/隱藏圖像

回答

相關問題