使用javascript显示/隐藏项目

我使用JavaScript开发了一个3D模型

我需要使用复选框显示/隐藏模型中的特定项

在html文件中，复选框已实现

<div id= "shower" class="row-shower" /div>
<input type="checkbox" id="show-shower" /> 
<label for="show-shower"> show/hide shower </label>

CSS代码：

.cubicle {
    display:block;
}

.hideCubicle {
   display:none;
}

当前我面临的问题是，当单击“显示/隐藏”复选框时，整个模型将消失。我只想让淋浴消失。不是整个模型

---

有没有关于如何执行此操作的建议

您可以更改重试代码，请参见 $document.readyfunction{ $.show-content.hide； $'.check'.change函数{ 如果$this.is:已选中{ $.show-content.show； } 否则{ $.show-content.hide； } }; }; 显示/隐藏 我使用JavaScript开发了一个3D模型。 我需要使用复选框显示/隐藏模型中的特定项。 在html文件中，复选框已实现。 我找到了解决办法

我只是将以下代码添加到JS文件中

---

您可能想知道pSpec变量来自哪里。这就是我用来在模型中创建分区的变量。我没有共享整个代码，因为它需要大量的编码。

首先，这里有一个未关闭/格式错误的div标记：您是否尝试过更改类而不是display属性？

.cubicle {
    display:block;
}

.hideCubicle {
   display:none;
}

 var elem = document.getElementById('shower');
 showshower = document.getElementById("show-shower");

 showshower.onchange = function ()
 {
     elem.classList = this.checked ? 'cubicle' : 'hideCubicle';
 };

if(checked){
                pSpec.cubicle.visible=false;


                console.log("hide");
            }
else
          {
                pSpec.cubicle.visible=true;


                console.log("show");
            }