Javascript-форум - Помогите, с динамическим добавлением <input >

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Помогите, с динамическим добавлением <input > (https://javascript.ru/forum/misc/9633-pomogite-s-dinamicheskim-dobavleniem-input.html)

Помогите, с динамическим добавлением <input >

Пытаюсь я зделать <input > чтоб при клацаньи на "+" добавлялся новый и присваивалось имя типа такого <input name="food[1]" /> а при нажатии "-" удалялись по очереди снизу вверх естестно, задача кажись не сложна...

но вот тока в JS я новичек и нефига неполучеться ... :cray:
Начал я так .. но в данном примере <input name="food[1]" /> с подобным именем справиться немогу .. и ктомуже нехватает функции удаления

d = document;

function addRow()
{

var tbody = d.getElementById('tab1').getElementsByTagName('TBO DY')[0];

var row = d.createElement("TR");
tbody.appendChild(row);

var td1 = d.createElement("TD");

row.appendChild(td1);

// Наполняем ячейки
td1.innerHTML='<input class="food_input_center" type="text" name="food[]"/>';

}

Помогите плиз ...

<div>
	<div id="area">
	</div>
</div>
<input type="button" value="+" onclick="add();" />
<input type="button" value="-" onclick="remove();" />
<script type="text/javascript">
var e = document.getElementById('area');
function add() {
	var c = document.createElement('input');
	c.type = 'text';
	e.appendChild(c);
}
function remove() {
	var q = e.getElementsByTagName('input');
	q[q.length - 1].parentNode.removeChild(q[q.length - 1]);
}
</script>

Подскажите еще 1 момент плиз ...

<input name="food[1]" /> - присвоение подобного имени при добавлении нового инпата
food[1] - нада както номер накручивать .. незнаю от чего отпраться ..

q.length - хотя наверно .. от этого опираться

СПС ... сча попробую!!

<div>
	<div id="area">
	</div>
</div>
<input type="button" value="+" onclick="add();" />
<input type="button" value="-" onclick="remove();" />
<script type="text/javascript">
var e = document.getElementById('area');
function add() {
	var c = document.createElement('input');
	c.type = 'text';
	c.name = 'food[' + e.getElementsByTagName('input').length + ']';
	e.appendChild(c);
}
function remove() {
	var q = e.getElementsByTagName('input');
	q[q.length - 1].parentNode.removeChild(q[q.length - 1]);
}
</script>

но тут малец с поправкой влез ))) если надо имя с единицы начинать

<div>
	<div id="area">
	</div>
</div>
<input type="button" value="+" onclick="add();" />
<input type="button" value="-" onclick="remove();" />
<script type="text/javascript">
var e = document.getElementById('area');
var q = e.getElementsByTagName('input');
function add() {
	var c = document.createElement('input');
	c.type = 'text';
    c.name = "food["+(q.length+1)+"]";
    e.appendChild(c);
}
function remove() {
   	q[q.length - 1].parentNode.removeChild(q[q.length - 1]);
}
</script>