如何隐藏除标签jQuery以外的标签内的所有内容？

我有一个<p>标记，我需要隐藏文本。还有<span>里面的<p>其中我不想隐藏这段文字。这可以做到而不用使用jQuery改变标记？如何隐藏除标签jQuery以外的标签内的所有内容？

HTML：

<p class="class"> 
    <span>Text not to hide</span> 
    <br> 
    Text to hide 
</p>

来源

2015-08-28 Chipe

请注明最好的答案，以帮助未来的游客所接受。 – Ahmad

您可以使用CSS visibility属性：

$('.class').css('visibility', 'hidden'); 
$('.class').children().css('visibility', 'visible');

Here is a working codepen

然后你可以通过做再次使其可见：

$('.class').css('visibility', 'visible');

来源

2015-08-28 21:00:50

请注意，这种方式不会从页面流中删除元素，而只是使其不可见。 – Ahmad

只要你可以复制span元素的p标签附近，然后隐藏p标签。试试这个：

$("p").after($("p span")) 
$("p").hide()

来源

2015-08-28 20:58:18 Ahmad

这是非常错误的。这修改了DOM结构。这也重复了内容。 http://jsfiddle.net/rjnw6d15/ – undefined

这使DOM中的变化，但不是在标记。如果你小心你的工作，那就没有问题。这是可以做到这一点的唯一方式，不需要使用隐形技巧。 – Ahmad

他/她应该小心吗？什么是“隐形技巧”？不，这不是唯一的解决方案，实际上你的代码甚至不是一个解决方案，因为如果有多个'p'元素，它不能解决问题。 – undefined

你可以不隐藏文本节点。您只能删除它们或用另一个元素包装它们并隐藏该包装器元素。

以下代码片段隐藏了非span元素并删除了文本节点子项。

$('p.class').contents().each(function() { 
    var $this = $(this); 
    if (this.nodeType === 3 && $.trim(this.nodeValue)) { 
     $this.remove(); 
     // in case that you just want to hide the text node 
     // $this.wrap('<i>').parent().hide(); 
    } else if (this.nodeType === 1 && this.tagName !== 'SPAN') { 
     $this.hide(); 
    } 
});

http://jsfiddle.net/xxpopvje/

来源

2015-08-28 21:05:34 undefined

使用此，并尝试自动换行是隐藏在包装p元素像

<p><span>Text not to hide</span><br/><p>Text to hide</p></p> 

$('p').find('*').not('span').css('display','none');

来源

2015-08-28 21:06:03

如何隐藏除标签jQuery以外的标签内的所有内容？

回答

相关问题