javascript - 如何在其他div中显示输入的数据？

Question

我必须一一输入数据，点击添加按钮后，数据应添加并显示到其他 div。我正在使用html，* css * 和javascrit。就像购物网站一样，我们一一添加产品，它出现在购物车中。

我是网页设计新手，请帮忙。

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>