我正在嘗試使用 vanilla JS 更改 div 的樣式。div 應該有一個特定的 id 和類名tab-content：
function showTabContent() {
document.getElementById(tabID).classList.contains("tab-content").style.display = "block";
}
HTML：
<div id="1" class="tab-content">Test...</div>
<div id="2" class="tab-content">Test...</div>
<div id="3" class="tab-content">Test...</div>
例如，如果我運行：
showTabContent(2);
它應該將tab-content具有 id 的 div設定2為樣式顯示塊。它不作業。我究竟做錯了什么？
uj5u.com熱心網友回復：
粘貼的代碼是否來自源代碼。
上面的函式showTabContent()應該接受引數。
showTabContent(tabId)
uj5u.com熱心網友回復：
您必須tabID在函式中作為引數傳遞，也不需要classList.contains()
function showTabContent(tabID) {
document.getElementById(tabID).style.display = "block";
}
showTabContent(2);div {
display: none
}<div id="1" class="tab-content">Test...</div>
<div id="2" class="tab-content">Test...</div>
<div id="3" class="tab-content">Test...</div>uj5u.com熱心網友回復：
由于您正在傳遞idto 函式showTabContent，因此您可以使用引數 ie 接收它tabId。
然后你必須找到元素并檢查它的存在。指定的元素可能id不存在。
function showTabContent(tabId) {
const element = document.getElementById(tabId);
if (element) {
element.style.display = "block";
element.style.backgroundColor = "lime"; // FOR VISUAL PURPOSE ONLY
}
}
showTabContent(2);<div id="1" class="tab-content">Test...</div>
<div id="2" class="tab-content">Test...</div>
<div id="3" class="tab-content">Test...</div>uj5u.com熱心網友回復：
首先，您應該將 tabID 傳遞給您的函式。
JavaScript 中的 .containe() 方法顯示字串是否包含特定的單詞或字母，如果條件為真，它將回傳true. （布林值）如果您想獲取具有特定 ID 和tab-content類的元素，您可以使用querySelector.
document.querySelector("#" tabId ".tab-content").style.display="block"
但由于 ID 通常是唯一的，因此僅參考 ID 就足夠了。
document.getElementById(tabId).style.displey="block"
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/497715.html
標籤：javascript