innerHTML が悪だと思われていることは知っていますが、リンク テキストを変更する最も簡単な方法だと思います。例えば：
<a id="mylink" href="">click me</a>
JS では、次のようにテキストを変更できます。
document.getElementById("mylink").innerHTML = new_text;
そして、プロトタイプ/jQuery では:
$("mylink").innerHTML = new_text;
正常に動作します。それ以外の場合は、最初にすべての子ノードを置き換えてから、テキスト ノードを追加する必要があります。なぜわざわざ？
どうですか
document.getElementById('mylink').firstChild.nodeValue = new_text;
これは、PEZ で説明されている問題に悩まされることはありません。
Triptych のコメントと bobince の返信に関しては、別の解決策があります。
var oldLink = document.getElementById('mylink'),
newLink = oldLink.cloneNode(false);
newLink.appendChild(document.createTextNode(new_text));
oldLink.parentNode.replaceChild(newLink, oldLink);
innerHTML はまったく悪ではありません。結果を認識している限り、それを使用しても問題はありません。
DOM3 をサポートするブラウザーの場合は、textContentを使用できます。
document.getElementById("mylink").textContent = new_text;
これは FF (3 でテスト済み)、Opera (9.6 でテスト済み)、Chrome (1 でテスト済み) で動作しますが、MSIE7 では動作しません (MSIE8 でテストされていません)。
例を追加
きれいではありませんが、クロスブラウザで動作するはずです（FF3、Opera9.6、Crome1、MSIE7でテスト済み）
function replaceTextContent(element,text) {
if (typeof element ==="string") element = document.getElementById(element);
if (!element||element.nodeType!==1) return;
if ("textContent" in element) {
element.textContent = text; //Standard, DOM3
} else if ("innerText" in element) {
element.innerText = text; //Proprietary, Micosoft
} else {
//Older standard, even supported by Microsoft
while (element.childNodes.length) element.removeChild(element.lastChild);
element.appendChild(document.createTextNode(text));
}
}
(更新: Microsoft 独自の innerText のサポートを追加)
innerHTML には副作用があります (既存の DOM ノードの切断や重い再レンダリングなど)。これらの影響を認識する必要があります。また、コードを保守している人は、innerHTML が使用されていないと奇妙なバグに遭遇する可能性があることに注意する必要があります。
1 年前までは、innerHTML は DOM を介してイベントを操作するよりもはるかに高速でした。これについては、すべての主要なブラウザの最新バージョンを自分でチェックしていません。
たとえば、Firefox はこれをうまく処理できません。変更を反映するために画面を更新するだけの場合もあります。変更後に DOM を照会すると、古い値がまだ残っています。
例: innerHTML を介して textarea の値を変更してから、フォームを投稿します。テキストエリアが以前に持っていた値を黙って投稿します。そのようなものがもたらす可能性のある壊滅的な結果について考えてみてください。
たぶん、innerHTML のアイデアを拒否するのは、一部の標準的な常習者だけです。
innerHTML は、W3C 標準ではありませんが、すべてのブラウザーが実装しているため、実用的な標準です。
ただそれを使用してください。それは魅力のように機能します。
別のオプションは、2 つの div を持ち、.hide() と .show() を使用することです。