3

次のスニペットに示すように、太字の部分、改行、テキストの部分があるテキストの複数の div があります。太字部分は find() できますが、太字部分の後の改行に続くテキスト部分のみを javascript/jquery で取得するにはどうすればよいですか?

<div class="thecontent">
any amount of text or html elements before
<b>
    the bolded text
</b>
<br>
the text I need together with the bolded text which can contain other html
elements apart from line breaks and bolded blocks
<br>
<b>
    posibility of more bolded and text couples further in the div
</b>
<br>
and some more text to go with the bolded text
</div>

1 つの div に複数の太字部分とテキスト カップルが存在する可能性があり、必要なテキストの断片は、改行、別の太字部分、または div の終わりで終了する必要があります。<a href>テキスト ブロックのような他の html 要素が存在する場合があります。

<b> </b>withの内容を取得でき、.find('b')使用してテキスト ノードを選択しようとしましnodeType == 3たが、すべてのテキストしか取得できません。

残念ながら、ページの html を変更することはできません。誰かが解決策を持っていますか? 前もって感謝します ：）

要求に応じて、入力は太字のブロックになり、改行とそれに続くテキストになります。改行または別の太字部分まで、それらに続くテキストが必要です。

出力は、ある変数の太字のテキストと、改行の後に続くテキストですが、別の変数の次の改行または太字の要素までです。

したがって、html の例の出力は次のようになりますthe bolded text。the text I need together with the bolded text which can contain other html elements apart from line breaks and bolded blocks

とposibility of more bolded and text couples further in the div+and some more text to go with the bolded text

4

1 に答える 1

3

すべてのノードを取得してそれらを分離するなど、本当に簡単な方法はないと思いますが、確かに可能です。あなたがテキストで何をしようとしているのかわからないので、作業しやすいようにすべてを含むきちんとした小さなオブジェクトを作成しました。または、ニーズに合わせてコードを変更することもできます。

var elem    = $('.thecontent').get(0).childNodes,
    content = {},
    i = 0;

for (key in elem) {
    var type = elem[key].tagName ? elem[key].tagName : 'text';
    content[i] = {};
    content[i][type] = elem[key].tagName == 'B' ? $(elem[key]).text() : elem[key].nodeValue;
    i++;
}

console.log( content );

フィドル

これは以下を返します:

{"0": {"text" : "any amount of text or html elements before"},
 "1": {"B"    : "the bolded text"},
 "2": {"text" : "\n"}, //also returns newlines
 "3": {"BR"   : null},
 "4": {"text" : "the text I need together with the bolded text which can contain other html elements apart from line breaks and bolded blocks"},
 "5": {"BR"   : null},
 "6": {"text" : "\n"},
 "7": {"B"    : " posibility of more bolded and text couples further in the div"},
 "8": {"text" : "\n"},
 "9": {"BR"   : null},
 "10":{"text" : "and some more text to go with the bolded text"},
}

これは、行番号 (ゼロから始まる)、タグ名、テキスト コンテンツ、またはその他の必要なものに基づいてフィルター処理できます。

于 2013-02-15T13:01:11.907 に答える