10

私はこのようなものを持っています。

<div id="firstDiv">
    This is some text
    <span id="firstSpan">First span text</span>
    <span id="secondSpan">Second span text</span>
</div>

「 This is some text 」を削除したいので、html要素をそのままにする必要があります。

私は次のようなものを使用してみました

$("#firstDiv")
    .clone()    //clone the element
    .children() //select all the children
    .remove()   //remove all the children
    .end()  //again go back to selected element
    .text("");

しかし、うまくいきませんでした。

.text(""))子タグ内のテキストではなく、タグ内のフリーテキストのようなものを介して、取得する (そしておそらく削除する) 方法はありますか?

どうもありがとう。

4

4 に答える 4

7

テキスト ノードを除外して削除します。

$('#firstDiv').contents().filter(function() {
    return this.nodeType===3;
}).remove();

フィドル

テキスト自体もフィルタリングするには、次のようにします。

$('#firstDiv').contents().filter(function() {
    return this.nodeType === 3 && this.nodeValue.trim() === 'This is some text';
}).remove();

そしてテキストを取得するには：

var txt = [];

$('#firstDiv').contents().filter(function() {
    if ( this.nodeType === 3 ) txt.push(this.nodeValue);
    return this.nodeType === 3;
}).remove();
于 2013-07-25T07:32:57.590 に答える
2

バニラJSの方が簡単なのに、なぜjQueryにそれを強制しようとするのですか:

var div = document.getElementById('firstDiv'),
    i,
    el;

for (i = 0; i< div.childNodes.length; i++) {
    el = div.childNodes[i];
    if (el.nodeType === 3) {
        div.removeChild(el);
    }
}

ここでフィドル: http://jsfiddle.net/YPKGQ/

于 2013-07-25T07:43:10.850 に答える
2

このフィドルをチェックしてください

このhtmlがあるとします

<parent>
  <child>i want to keep the child</child>
  Some text I want to remove
  <child>i want to keep the child</child>
  <child>i want to keep the child</child>
</parent>

次に、次のように親の内部テキストを削除できます。

var child = $('parent').children('child');
$('parent').html(child);

あなたのhtmlへの解決策については、このフィドルをチェックしてください

var child = $('#firstDiv').children('span');
$('#firstDiv').html(child);

PS: 要素を削除してから再作成すると、その div にバインドされたイベント ハンドラーが失われることに注意してください。

于 2013-07-25T07:35:05.287 に答える
0

これをチェックしてください、それがあなたが望むことを正確に行うかどうかはわかりません... 注：私はクロムでのみテストしました

http://jsfiddle.net/LgyJ8/

cleartext($('#firstDiv'));

function cleartext(node) {

    var children = $(node).children();
    if(children.length > 0) {

        var newhtml = "";
        children.each(function() {

            cleartext($(this));

            newhtml += $('<div/>').append(this).html();

        });

        $(node).html(newhtml);

    }
}
于 2013-07-25T07:47:21.523 に答える