jquery - jQuery、forループを使用してテキストを2回印刷する方法は?

Question

ここで何が間違っていますか？

---

次のコードがあります。

HTML:

<div></div>

jQuery:

for(var i = 0; i < 2; i++){
  console.log('test');
  $('div').text('sometext ');
}

私の出力:

何らかのテキスト

私が期待するもの：

なんらかの

テキストが div に 2 回出力されないのはなぜですか?

Answer 1

使用する.append()

.text は以前のコンテンツを置き換えます。

for(var i = 0; i < 2; i++){
  console.log('test');
  $('div').append('sometext');
}

フィドルをチェック

または

あなたが本当に使いたいならtext、これを行うことができます

var html = '';
for(var i = 0; i < 2; i++){
  console.log('test');
  html += 'sometext ';
}
$('div').text(html);

フィドル 2

テキストを変数に格納し、for ループの後にテキストを使用します。

Answer 2

append を使用する代わりに、createTextNode 呼び出しを使用することをお勧めします。つまり、次のようになります。

for(var i = 0; i < 2; i++){
  console.log('test');
  $('div').append(document.createTextNode('sometext');
}

append (および appendTo) 関数は、テキストではなく HTML を想定しています。実際には、特殊文字 (< や > など) はエスケープされず、HTML として処理されることを意味します。これは、意図したものである場合とそうでない場合があります。

テキストと HTML の作成/追加の詳細については、追加とテキストのドキュメントと例を確認してください。

Answer 3

Print Footer At Bottom Of Page

<div 
media="print"
class="no_screen" 
style=" margin-bottom:0;        
    font-size:10px;
    font-family:arial;
    text-align:center;
    width:100%;
    letter-spacing:2px;
    bottom: 0;
    position: fixed;
    color:black; "
>Designed By Good People.</div>   

作業例リンク

jsfiddle.net/ROYALHUNTER/A85QL/