如何隱藏/刪除兩個元素之間的所有文本？

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()">