nforcer89,
новая функция getInfo ниже
<!DOCTYPE html>
<html>
<head>
<title>Training plan v2</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<form id="daily" method="get">
<h1>Дневник тренировок</h1>
<label>
Дата тренировки:
<input type="date" class="information" id="date">
</label>
<div class="exblock">
<input type="text" class="information" id="exercise" placeholder="Упражнение">
<input type="number" class="information" id="sets" placeholder="Подходы">
<input type="number" class="information" id="reps" placeholder="Повторения">
<input type="button" class="buttons" id="DelElem" value="Удалить">
</div>
<input type="button" class="buttons" id="AddElem" value="Добавить">
<br>
<input type="button" id="makeplan" value="Создать план">
</form>
<hr>
</body>
<script>
function getInfo() {
var divs = document.querySelectorAll('.exblock');
return [].map.call(divs, function(div) {
var info = div.querySelectorAll('.information');
return {
exercise : info[0].value,
sets : info[1].value,
reps : info[2].value,
date : document.querySelector('#date').value
}
});
}
function addExercise() {
let parent = document.querySelector('#daily');
let element = parent.querySelector('.exblock');
let clone = element.cloneNode(true);
parent.insertBefore(clone, parent.children[3]);
}
function createPlan(info) {
let newday = document.createElement('div');
let parent = document.querySelector('body');
newday.innerHTML = info['date'] + " Упражнение: " + info['exercise'] +
'. Подходов: ' + info['sets'] + '. Повторений: ' + info['reps'];
parent.appendChild(newday);
}
document.querySelector('#AddElem').addEventListener('click', addExercise);
document.querySelector('#makeplan').addEventListener('click', function () {
let info = getInfo();
info.forEach(createPlan);
});
</script>
</html>
|