Добавление динамического элемента — одна из сложных задач для новичка, который только начал изучать веб-разработку и начал создавать проекты, похожие на список дел.

Здесь, в этой статье, я буду рассматривать рабочий и понятный код.

Первый пример::

HTML Code
<html>
  <body>
    <button onclick="create()">Create Heading</button>
  </body>
</html>
Javascript code::
 function create() {
        var h1 = document.createElement('h1');
        h1.textContent = "New Heading!!!";
        document.body.appendChild(h1);
      }

Второй пример::

HTML Code
<body>
  <h1>My ToDo List</h1>
  <input type="text" id="getValues" />
  
  <button onclick="myFunction()"> Add task </button>
  
</body>
Javascript Code::
function myFunction(){
   var inputValue = document.getElementById("getValues").value;
  var li= document.createElement('li');
  li.textContent= inputValue;
  document.body.appendChild(li);
  
   console.log("The value in the text box is ="+inputValue);
}

Практикуйте оба примера, вы поймете это.

Я регулярно публикую в твиттере контент на основе javascript, html, css и angular. Пожалуйста, следите за ними в твиттере, чтобы получить интересную концепцию, основанную на javascript.