javascript - jqueryの使い方..... addClass().find().text()

Question

これが私が望む結果です：

<div id="error" class="alert warning"><span  class="icon"></span>text here</div>

私はこれを試しました：

$('#error').addClass('alert error').find('span').addClass('icon').text('text here');`

これにより、次のようになります。

<div id="error" class="alert warning"><span class="icon">text here</span></div>

私もこれを試しました：

$('#error').addClass('alert warning').text('text here').find('span').addClass('icon');

これにより、次のようになります。

<div id="error-arch" class="alert warning">text here</div>

私は何を間違っていますか？

Answer 1

の内容をすべて置き換えるを呼び出す代わりに、次のよう.text()にします。divdivappend

$('#error')
    .addClass('alert warning').append('text here')
    .find('span').addClass('icon');

これがフィドルです：http://jsfiddle.net/v2ULf/

---

そこに既にテキストがあり、それを置き換えるだけの場合は、最初にテキスト ノードを見つける必要があります。

$('#error').contents().filter(function() {
    return this.nodeType == 3;
}).last()[0].nodeValue = 'New Text';

これがフィドルです：http://jsfiddle.net/v2ULf/1/

Answer 2

私はお勧めします：

$('#error')
    .addClass('error warning')
    .find('span')
    .addClass('icon')
    .after(
        function () {
            return document.createTextNode('text here');
        });

JS フィドルのデモ。

に間違ったクラス名を追加したようですaddClass()が、理論はまったく同じですが、追加したいクラス名に明らかに修正してください。そして、リンクされた Fiddle では、jQuery メソッドで追加/実行していることに基づいて、開始 HTML を推測する必要がありました。