我有以下腳本僅適用于一個 div（“dois”），但我想為此代碼包含另一個 div\variable。這段代碼如何為 2 個 div 正常作業？
document.getElementById("_bar_Id_").onclick = function(c) {
var x = document.getElementById("dois");
if (x.style.visibility === "hidden") {
x.style.visibility = "visible";
} else {
x.style.visibility = "hidden";
}
}
uj5u.com熱心網友回復：
您必須.onclick按如下方式創建另一個偵聽器：
document.getElementById("_bar_Id_").onclick = function(c) {
//for element with id: dois
let x = document.getElementById("dois");
if (x.style.visibility === "hidden") {
x.style.visibility = "visible";
} else {
x.style.visibility = "hidden";
}
//for element with id: dois2
x = document.getElementById("dois2");
if (x.style.visibility === "hidden") {
x.style.visibility = "visible";
} else {
x.style.visibility = "hidden";
}
}
當您有很多需要在點擊時更改的元素時，這顯然不會擴展。id所以你應該有一個你想要監聽的所有元素的陣列，并為每個元素添加一個事件監聽器，如下所示：
const elementIds = ["dois", "dois2", "dois3", "dois4",];
document.getElementById("_bar_Id_").onclick = function(c) {
for (id of elementIds) {
const x = document.getElementById(id);
if (x.style.visibility === "hidden") {
x.style.visibility = "visible";
} else {
x.style.visibility = "hidden";
}
}
}
現在，每當您有一個新的 div 并且id您想收聽時，您只需將它們添加到elementIds陣列中。
更進一步的改進將是您選擇更改屬性的專案的方式。對于最后一個解決方案，每當您需要添加另一個元素時，您都必須想出一個唯一的id并將其添加到elementIds陣列中。
或者，您可以提供更改visibility公共類所需的所有元素，例如barClickTarget并用于getElementsByClassName獲取該類的所有元素。然后，現在你可以：
HTML
<div class="barClickTarget">...</div>
<div class="barClickTarget">...</div>
<div class="barClickTarget">...</div>
JS
document.getElementById("_bar_Id_").onclick = function(c) {
const elems = document.getElementsByClassName("barClickTarget");
for(const x of elems) {
if (x.style.visibility === "hidden") {
x.style.visibility = "visible";
} else {
x.style.visibility = "hidden";
}
}
}
而現在添加另一個所需要做的barClickTarget就是將其添加到目標元素的類中。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/476807.html
標籤：javascript
上一篇：使用多個引數檢查用戶資訊