使用 Javascript 将样式添加到元素

Question

我已经向客户的网站添加了一个简单的 jquery SlideDown 函数，但他们希望通过 javascript 添加一些样式，以便任何禁用 JS 的人仍然可以看到内容。

<script>
    $(".click").click(function () {
        $(".morecontent").slideToggle("slow");
    });
</script>

.morecontent 当前设置为通过样式表显示：无，所以基本上我想在脚本中包含此样式，而不是样式表

Answer 1

要使用 jQuery 设置 CSS，请使用：

$(".morecontent").css("display", "none");

display:none 属性也可以使用 .hide() 设置。 注意：您应该在文档准备好时调用此代码，即元素已经定义。要实现此目的，请使用：

$(document).ready(function(){
    $(".morecontent").hide();
})

当禁用 JavaScript 时，元素将可见（因为样式表中的 display:none 已被删除）。当启用 JavaScript 时，脚本会隐藏 .morecontent，以便可以滑入。

Answer 2

删除样式表中的 display:none 并在页面加载时使用 jQuery 隐藏类 morecontent 的元素：

<script>
    $(".morecontent").hide();
    $(".click").click(function () {
        $(".morecontent").slideToggle("slow");
    });
</script>

这可能会导致闪烁，因为页面加载时元素被隐藏。您可以通过在页面顶部隐藏整个页面 $('body').hide(); 并在底部再次显示来解决此问题。

Answer 3

<script>
    $(".morecontent").css ( {display: "none" } );
    $(".click").click(function () {
        $(".morecontent").slideToggle("slow");
    });
</script>

Answer 4

使用这个：

$('.morecontent').hide();