我的代碼運行良好，但我想進行更改，僅通過搜索無法找到答案。我正在尋找以下部分的動態資料，但是當我沒有要填充的資料時，我想隱藏按鈕，這可能嗎？
<style>
.elementor-editor-active .hidden{
display:block;
}
.hidden{
display: none;
}
.shown{
display: block !important;
}
</style>
<script>
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
var btn3 = document.getElementById("btn3");
var btn4 = document.getElementById("btn4");
btn1.onclick = function(event){
event.preventDefault();
toggleDivs("sect1");
};
btn2.onclick = function(event){
event.preventDefault();
toggleDivs("sect2");
};
btn3.onclick = function(event){
event.preventDefault();
toggleDivs("sect3");
};
btn4.onclick = function(event){
event.preventDefault();
toggleDivs("sect4");
};
function toggleDivs(s){
document.getElementById("sect1").classList.remove("shown");
document.getElementById("sect2").classList.remove("shown");
document.getElementById("sect3").classList.remove("shown");
document.getElementById("sect4").classList.remove("shown");
document.getElementById(s).classList.add("shown");
}
btn1.focus();
btn1.click();
</script>
uj5u.com熱心網友回復：
我沒有看到您的 HTML 樹，所以我無法給出準確的答案。但是你可以使用mutationObserver，所以你可以觀察你的目標元素。如果沒有資料，您可以運行一個函式來隱藏按鈕。
uj5u.com熱心網友回復：
這是一個片段，如果相關的 div 為空，它將隱藏一個按鈕：
const divs=document.querySelectorAll("div"),
hideAll=()=>divs.forEach(d=>{ // hide all selected divs
if (d.textContent==="") // hide associated button too, if div is empty:
document.getElementById(d.id.replace("sect","btn")).style.display="none"
d.style.display="none"
});
document.onclick=ev=>{
if(ev.target.tagName==="BUTTON") {
if (ev.target.id){
hideAll();
document.getElementById(ev.target.id.replace("btn","sect")).style.display=""
} else {
divs[2].textContent="";
hideAll()
}
}}
hideAll();div {background-color:#ddd; padding:10px; margin:6px; border: 1px solid grey}<div id="sect1">This is section one</div>
<div id="sect2">This is section two</div>
<div id="sect3">This is section three</div>
<div id="sect4">This is section four</div>
<button id="btn1">show one</button>
<button id="btn2">show two</button>
<button id="btn3">show three</button>
<button id="btn4">show four</button>
<br><br>
<button>empty div#sect3</button>轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/416921.html
標籤：