<!DOCTYPE html>
<html>
<body>
<h1>The Document Object</h1>
<h2>The forms Property</h2>
<form action="/action_page.php">
<p>First name: <input type="text" name="fname" value="Donald"></p>
<p>Last name: <input type="text" name="lname" value="Duck"></p>
<p>City: <input type="text" name="fname" value="Duckburg"></p>
<input type="submit" value="Submit">
</form>
<p>The value of each element in the form is:</p>
<p id="demo"></p>
<script>
const form = document.forms[0];
let text = "";
for (let i = 0; i < form.length; i++) {
text += form.elements[i].value + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>