、div要素をクリアしたい最初の

Question

私のHTMLがどのように見えるとJSは次のようになります。

<div class="container"></div> 

var html = "<div class="error">hello</div>"; 

$(".container").append($(html)); 

問題は、私が最初にクラス=コンテナとのdiv内のHTMLをクリアしていないということです私はその地域にメッセージを続けています。

最初にdivクラス= "container"内のものをクリアしてから、次に 'html' divを追加する方法はありますか？

Answer 1

あなたのdivにあるもの「置き換える」に意味と仮定すると、私はあなたが使用するために必要なものだと思うです：それを行うには

$(".container").html(html); 

よりjQueryish方法は次のようになります。

$errorDiv = $('<div>hello</div>').addClass('error'); 
$(".container").html($errorDiv.html()); 

これには、エラーdivへの参照を与えるという追加の利点があります。

Answer 2

新しいdiv要素を追加する前に、

​​

を呼び出すことができます。

参考： http://docs.jquery.com/Manipulation/empty

Answer 3

私はあなたのステータスメッセージのコンテナを使用して、コンテナのdivの内側に行くために急いでエラー/成功メッセージを作成していることを前提とする自由を取ります。

HTML：：

<div id="status"></div> 

Javascriptを：以下

function showError(msg) { 
    $('#status').html(msg).addClass('error'); 
} 
function showStatus(msg) { 
    $('#status').html(msg).removeClass('error'); 
} 

注：もしそうなら、私の代わりに、以下のアプローチと一緒に行くことをお勧めしたい

• パオロがで言及したよう彼のコメントは、をidで参照する方がはるかに効果的です。 e javascript document.getElementById()メソッドです。これは、DOMツリー全体で1つの要素を検索するよりも高速です...
• <div class="container">の内容を呼び出しごとにクリアしていたので、それを保持する理由は見当たりませんでした。あなたはちょうどちょうど同様にHTMLコンテンツとを1つのdivのcssクラスを操作することができます。より速く、あなたのマークアップでよりよく見える=）
• 明らかにあなたのショー状態/エラーメッセージロジックは別々の方法では必要ありません。

Answer 4

これは、私ははい、あなたが正しいですそれについて

$(document).ready(function() { 
     $('.err').click(function() { 
      $('.err').empty().text('Massive Error has occured. ooof!!!'); 
     }); 
    }); 

Answer 5

を行った方法です。私はappendメソッドのためにそれを言うつもりだった。そう

：

$(".container").empty().append(htmlOfyourerror);