javascript - 使用 Javascript/jQuery 隐藏/删除内容

Question

如何使用 javascript/jQuery 隐藏/删除内容？

<p class="remove">Text removed on load.</p>

$(document).ready(function(){
    //How to hide/remove p element
});

FIDDLE

Answer 1

方法有很多种。您应该使用哪个取决于您是否希望从 DOM 中删除您的内容。或者你想要它在 DOM但不可见

如果你想从 DOM 中移除你的元素，那么你应该使用 remove()

$(document).ready(function(){
        $('.remove').remove();
});

DEMO

如果您想隐藏您的元素，有一些不同的方法。

您可以使用 hide()

$(document).ready(function(){
    $('.remove').hide();
});

DEMO2

或者您可以使用 visibility:hidden

$(document).ready(function(){
    $('.remove').css("visibility","hidden");
});

DEMO3

甚至left会做你的工作

$(document).ready(function(){
    $('.remove').css("left","-999em");
});

DEMO4

但是这个“hack”有性能问题。阅读more

还有其他一些我不推荐但可以完成工作的方法。

您可以使用 html()

$(document).ready(function(){
    $('.remove').html("");
});

DEMO5

或者您可以使用 toggle()

$(document).ready(function(){
    $('.remove').toggle();
});

DEMO6

或者您可以使用 opacity:0

 $(document).ready(function(){
    $('.remove').css("opacity","0");
});

DEMO7