javascript - What's a good way to show parts of an element but hide the rest?

Question

I was wanting to have a javascript (jQuery) function that removed everything that didn't have the safe class.

The problem is, if the parent element is hidden, it cannot show the 'safe' part of it.

Is there a simple way to get around this? I'd rather not go in and span all of the elements that need removed.

trimmer = function(element){
    x = $(element+' *:not(.safe)');
    x.hide();   
}
trimmer('section');

Fiddle

Answer 1

var element = 'section';

//finds all non `.safe` elements in `section`s and hides them
$(':not(.safe)', element).hide();  

//finds all `.safe` elements in `section`s and shows the `section`s
$('.safe', element).parents(element).show();  

Answer 2

霍连说的没错，隐藏元素的一部分确实是不可能展现出来的。

要仅使部分文本消失，safe必须将非内容标记为删除。

$(element).contents().each(function() {
  if (this.nodeType == 3)
    $(this).wrap('<span class="disappear" />');
});

您可以在此处阅读有关此答案的更多信息： 如何将跨度添加到不受限制的节点的所有区域