JS/jquery在HTML/CSS中隐藏内容

Question

有没有一个“最佳实践”来隐藏HTML5网站中除了一个内容-DIV之外的所有内容？有没有“最常用”的库？或者它通常是用自己的JS代码编写的？

我的目标是加载9个DIVs。中间的一个是导航，其他的是内容。当选择一个导航点时，特定的div会“滑动”到中间，所有其他div都会隐藏起来。

谢谢

Answer 1

我会在所有的隐藏和显示div中添加一个类，可能是一个类似section的类名。

<div class="section" id="home"> home content here... </div>
<div class="section" id="page-slug"> another page here... </div>
<div class="section" id="contact"> contact information here... </div>

然后给每个div一个id。FInally，为了显示contact部分，您需要：

$('#contact').show().siblings('.section').hide();

这种为like元素提供相同的class并为容器元素提供id的方法实际上是一种很好的实践，不管在选择jQuery元素时是否易于使用。

Answer 2

我通常这样做：

$('.your_div').show().siblings().hide();

将.show()和.hide()替换为所需的效果。

Answer 3

Jquery的hide、.show或.toggle就足够好了。