javascript - 一键添加多个 .appends

Question

html:

<h1>Favorite Animal:</h1>
<input type='text'>
<button>Answer!</button>
<div id='ans'></div>

Javascript (jQuery)

$(document).ready(function(){
    $('button').click(function(){
        $('#ans').append('<h2>Bunny</h2>')
    })
})

你好。我想知道。我可以做到这样当我在 input[type='text'] 中输入一个数字然后出现那个数字的“兔子”吗？ (例如:我输入 3，“兔子”一词出现了 3 次)。

Answer 1

你可以用一个简单的循环来完成:

$(document).ready(function() {
  $('button').click(function() {
    for (i = 0; i < $('input[type=text]').val(); i++) {
      $('#ans').append('<h2>Bunny</h2>')
    }
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' />
<button>Answer!</button>
<div id='ans'></div>