javascript - 在页面加载时隐藏具有特定类的 div，然后在加载后再次显示

Question

我想在页面加载时隐藏特定的 div 类。结构是..

<div id ="container">
<div class="project-item tv"></div>
<div class="project-item radio"></div>
<div class="project-item radio"></div>
<div class="project-item tv"></div>
</div>

例如，我想在页面加载时隐藏带有类单选的 DIV，然后在加载后再次显示它们。谢谢。

Answer 1

首先，将它的 CSS 值设置为display:none

然后，在 Javascript 文件中，jQuery 解决方案将使用：

$(document).ready(function() {
     $("#yourdivid").show();
});

$(document).ready()确保在执行函数内部的代码之前加载整个 DOM

Answer 2

使用 CSS

使用css隐藏div

div.radio {
    display:none;
}

js

在DOM上显示带有类收音机的 div准备就绪

$(document).ready(function () {
    $('div.radio').show();
});

---

在加载时显示带有类收音机的 div

$(window).load(function () {
    $('div.radio').show();
});

阅读$(window).load 和 $(document).ready 有什么区别？

Answer 3

<style>
 div .radio  {display:none;}
</style>

<div id ="container">
<div class="project-item tv"></div>
<div class="project-item radio"></div>
<div class="project-item radio"></div>
<div class="project-item tv"></div>
</div>

在 JS 中

$().ready(function() {$("div .radio").css("display":"block")});

Answer 4

CSS：

.hidden { display: none; }

HTML：

<div id="blah" class="hidden"><!-- content --></div>

查询：

$(function () {
     $('#blah').removeClass('hidden');
 });