如何隐藏/删除两个元素之间的所有文本？

Question

让我说我有这个HTML块：

<div class="container">
<span class="title">Heading 1</span>
This is a description..<br />
This is the second line..
<div class="image"><img src="image.jpg" /></div>
</div>

我想用jQuery / JavaScript做的是隐藏/删除<span class="title">和<div class="image">之间的所有文本和元素。

我看了一遍，几乎找不到任何东西。 关于我如何做到这一点的任何想法？

Answer 1

这样的事怎么样？ http://jsfiddle.net/ZW8q2/1

var foo = $('.container').children(':not(br)');
$('.container').html('').html(foo);

Answer 2

你可以尝试：

var str = $('.container .title').text() + $('.container .image').html();
$('.container').html(str);

JS小提琴 。

Answer 3

尝试这个：

在要隐藏的内容周围添加标记，为div指定ID名称。 所以最后你会看起来像：

<div id = "hideMe" style ="display:block">...Your Content...</div>

使用此javascript：

    function hide()
    {
    document.getElementById('hideMe').style.display = "none";
    return;
    }

每当你想在按钮（或其他控件）之间隐藏div之间的东西时调用Javascript函数，如下所示：

<input type= "submit" onclick ="hide()">