Добавление ID в LI Javascript

Question

Итак, у меня есть следующий код, созданный для создания элемента li, когда кто-то вводит что-то в поле. Я также хочу, чтобы элемент li содержал уникальный идентификатор, который начинается с list-Item0 и перейдите к list-Item1 и т. Д. С каждым li, созданным, когда кто-то вводит в поле и добавляет элемент.

Любая идея, как я буду заниматься этим? Я не знаю, что такое JQuery, поскольку я полный новичок, поэтому я ищу что-то чрезвычайно базовое, которое я могу реализовать в этом коде.

Вот что я до сих пор:

function addItemFunction() { 
    document.getElementById("itemList").innerHTML=document.getElementById("itemList").innerHTML + '<li>' + addNewBox.value + '</li>'; 
} 

Answer 1

Просто держать счетчик для ID вне вашей функции, создать <li> элемент, установить идентификатор и содержание, увеличить счетчик и добавить элемент к вашему itemList ,

var listItemCounter = 0;   

function addItemFunction() { 
    var li = document.createElement('li'); 
    li.id = 'list-Item' + listItemCounter++; 
    li.innerHTML = addNewBox.value; 

    document.getElementById('itemList').appendChild(li); 
} 

Answer 2

В качестве расширения ответ Фила, вы можете избежать глобального счетчика, держа его в затворе:

var addItemFunction = function() { 
    var listItemCounter = 0;   

    return function() { 
     var li = document.createElement('li'); 
     li.id = 'list-Item' + listItemCounter++; 
     li.innerHTML = addNewBox.value; 

     document.getElementById('itemList').appendChild(li); 
    }; 
}());