Add new input lines to HTML entry form

Enable users to add a row of fields to an HTML input form. In this code, after the HTML loads, addForm() is called. Clicking the Add Line button calls a function, addLine(), which calls addField() once for each field in the new input line. The elements, label and input, are formatted using CSS.

Generate array of objects

Loop through HTML form lines and store the data into an array of objects

Generate a table containing data from array of objects

Local Name Local DOB Local Age Local Zodiac

Some highlighted difference between jQuery and JavaScript

  1. One of the major differences between the two, is that jQuery is much quicker to code than JavaScript.
  2. Individual JavaScript code has to be written to handle multi-browser compatability. Where jQuery is a multi-browser JavaScript library which results in less "individual" written code.
  3. The following shows the difference in changing the background color for both jQury and JavaScript:
    jQuery $ (‘body’) .css (‘background’, ‘#ccc’);
    JavaScript Function changeBachground(color) {
    Document.body.style.background = color;
    }
    Onload=”changeBackground (‘red’);”
  4. Again, the following shows the difference in jQuery and JavaScript when defining an Id Selector:
    JavaScript ID Selector
    var $el = document.querySelector('#hello');
    jQuery ID Selector
    var $el = $('#hello');
  5. In the end jQuery is more time efficient and proves less common to make an error. It is a powerful tool to execute intricate projects.