4

それが私の問題の例です

<div onclick="this.childNodes(0).innerHTML='0';">
1<b>2</b>3<b>4</b>5
</div>

ご覧のとおり、2 つの子ノード (「2」と「4」) がタグ付けされており、その他は単純なテキストです。問題は、他のノード/テキストに触れずに、特定の div コンテナー内のタグ付きおよびタグなしのノード (テキスト) の innerHTML を変更する方法です。

4

3 に答える 3

6

基本的に、テキストノード( 3)およびそれ以外の場合(fiddle)にはdata(text)プロパティを使用します。nodeTypeinnerHTML

<div onclick="this.childNodes[0][this.childNodes[0].nodeType === 3 ? 'data' : 'innerHTML'] = '0'">
1<b>2</b>3<b>4</b>5
</div>​

[編集]必要なのは基本的な概念の簡単な説明だけである場合、ソリューションとしてライブラリを提供するすべての人に本当にうんざりしています。たとえば、テキストノードと要素ノードのコンテンツプロパティは異なりdataますinnerHTML

于 2012-10-08T18:36:43.313 に答える
1

Linguigiという lib を作成しました。それは同じくらい簡単でしょう

new Linguigi(element).eachText(function(text) {
    if(this.parentNode.tagName === 'B') {
        return "BACON";
    }
});

これにより、b タグ内のすべてのテキスト ノードのテキストが「BACON」に変わります。元のコンテンツを「テキスト」パラメーターとして取得し、それを変換できます。

http://jsfiddle.net/Kz2jX/

onclickところで:インラインイベント処理(属性)を取り除く必要があります

于 2012-10-08T18:46:19.053 に答える
1

各ノードを再帰的に循環し、それらのプロパティを順番にチェックし、ノードがテキスト ノード ( で示される) の場合はプロパティを '0' でnodeType更新できます。nodeValuenodeType == 3

このHTMLがあると仮定します:

<div onclick="doReplace(this)">
    1<b>2</b>3<b>4</b>5
</div>

次に、次のように、自分自身を再帰的に呼び出す単純な置換関数を記述できます。

window.doReplace = function (rootNode) {
    var children = rootNode.childNodes;
    for(var i = 0; i < children.length; i++) {
        var aChild = children[i];
        if(aChild.nodeType == 3) {
            aChild.nodeValue = '0';
        }
        else {
            doReplace(aChild);
        }
    }
}

動作するフィドルはここにあります: http://jsfiddle.net/p9YCn/1/

于 2012-10-08T18:51:48.897 に答える