javascript - HTML 要素でこのテキストを置き換えるにはどうすればよいですか?

Question

「バナナ」を表示する文字列があります

「Apple」に置き換えたい

これは私が持っているものです

<span id="Fruit">Banana</span>

これは私が使用しているスクリプトです。

    var td1 = document.getElementById('Fruit');
    var text = document.createTextNode("Apple");
    td1.appendChild(text);

そして、これはそれが示すものです。

バナナりんご

    <span id="Fruit">
    "Banana"
    "Apple"
    </span>

Banana を削除して Apple に置き換えるにはどうすればよいですか?

<span id="Fruit">Apple</span>

Answer 1

innerHTML を更新するだけです: http://jsfiddle.net/SNtmL/

document.getElementById('Fruit').innerHTML = "Apple";

Answer 2

単一の と仮定するとtextNode:

var td1 = document.getElementById('Fruit'),
    text = document.createTextNode("Apple");
td1.replaceChild(text,td1.firstChild);

JS フィドルのデモ。

または：

var td1 = document.getElementById('Fruit');
td1.firstChild.nodeValue = 'Apple';

JS フィドルのデモ。

または：

var td1 = document.getElementById('Fruit'),
    text = 'textContent' in document ? 'textContent' : 'innerText';
td1[text] = 'Apple';

JS フィドルのデモ。

参考文献:

• Node.nodeValue.
• Node.replaceChild().

Answer 3

新しいテキスト ノードは必要なく、既存のノードを変更したい。

迅速で汚い解決策は次のとおりです。

document.getElementById("Fruit").innerHTML = "Apple";