javascript - 入力したデータを他のdivに表示するには?

Question

データを1つずつ入力する必要があり、ヒットした後、ADD BUTTONデータを追加して他のdivに表示する必要があります。私はhtml、* css * およびjavascritを使用しています。ショッピング サイトと同じです。つまり、商品を 1 つずつ追加すると、カートに表示されます。

私はウェブデザインに慣れていないので、助けてください。

Answer 1

ここに作業デモがあります

HTML:

<a href="#" class="design_button add">Click here to add Product</a>
<div id="this_div_contains_settings"></div>

jquery:

$(function(){
   var number = 1;
   $('a.add').click(function(e){
      e.preventDefault();
      $('#this_div_contains_settings').append('<div id="settings'+number+'">Product Item.<a href="#" class="design_button">Remove this Product</a></div>');
      number++;
   });
   $('#this_div_contains_settings').on('click','a.design_button', function(e){
      e.preventDefault();
      $(this).parent().remove();
   });
});

Answer 2

これは、学習に使用される最初のデモになる可能性があります

<div id="console"></div>
<input id="input" type="text">

<button id="trigger">Click me!</button>

<script>
document.getElementsById("trigger").onclick = function() {
  document.getElementById("console").innnerHTML = document.getElementById("input").value;
}

</script>