Link Search Menu Expand Document

მაგალითის გასარჩევად შექმენით index.html და index.js ფაილები და გაუშვით კოდი.

index.html

<div id="app">
	<button onclick="addNewItem()">add new item</button>
	<div id="task-items">
		<h1>I have to do...</h1>
	</div>
</div>
მთლიანი html ფაილის ჩვენება
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>task list აპლიკაცია</title>
	<style>
		.task-item {
			padding: 20px;
			font-family: sans-serif;
			background-color: #97c2b9;
			color: white;
		}
	</style>
</head>
<body>
	<div id="app">
		<button onclick="addNewItem()">add new item</button>
		<div id="task-items">
			<h1>I have to do...</h1>
		</div>
	</div>
	
	<script type="text/javascript" src="./task.js"></script>
</body>
</html>

task.js

function addNewItem() {
	var task = prompt("რა გაქვს გასაკეთებელი?")
	console.log(task)
	var taskItems = document.getElementById('task-items')
	console.log(taskItems)
	var taskElement = '<div class="task-item">' + task + '</div>'
	taskItems.insertAdjacentHTML('beforeend', taskElement)
}