这个问题不是关于如何切换 div。而是如何在大型 Web 应用程序中切换可见性。我的网络应用程序只需要在 Chromium (Webkit) 上运行。我遇到的问题可能与基础设施和最佳实践更相关，我想知道是否有人有这方面的经验。
我的应用程序在 node-webkit 上运行，这意味着所有文件都是本地文件，并且加载速度很快。为了感觉非常活泼，我尽可能将所有内容添加到 DOM 中。我想远离使用 Javascript 更改我的应用程序的状态，所以不$('.view-projects').addClass('visible');。因为它很快就会变得乱七八糟，而且我觉得这不是JS的任务。
相反，我选择的方法是这样的。
// javascript sample (I actually code in CoffeeScript)
// catch all click events on elements with data-trigger attributes
app.on('view:addProject', function () {
// add a class to the root view
$('#app').addClass('view-addProject');
}):
标记：
<!-- markup sample -->
<div id="app">
<div class="projects">
<div data-trigger="view:addProject"></div>
<div>etc.</div>
</div>
<div class="addProject">
etc.
</div>
</div>
css，用作状态机：
app.view-addProject .addProject {
visibility: visible;
display: block;
}
我想知道的是其他人是否尝试过这样的事情，是否有其他方法的良好经验等。或者我可能遗漏了什么，我觉得我在动态内容方面遇到了麻烦。
注意：我不能简单地使用显示/隐藏，因为我的元素使用display: -webkit-flex/-webkit-box;等。