<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ajax-wordbook</title>
</head>
<body>
<ul></ul>
<h2></h2>
<p></p>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
var dict = $('ul');
var title = $('h2');
var p = $('p');
$.getJSON('dict.json')
.done(function(data) {
for(var word of data) {
var li = $('<li></li>');
li.text(word.title);
li.data('word', word);
li.click(function(event) {
var el = $(event.target);
var word = el.data('word');
title.text(word.title);
p.text(word.description);
});
dict.append(li);
}
});
</script>
</body>
</html>
var todos = {};
$("#addButton").click(function() {
var text = $("#inputBox").val();
todos[text] = false;
$("#inputBox").val("");
console.log(todos);
});
<script>
var students = [
{ name:'김군오', id:'219xxx' },
{ name:'홍길동', id:'210xxx' }
];
var ul = $('ul');
for (let student of students) {
var li = $('<li>' + student.name + '</li>');
li.data('id', student.id);
li.click(function(event) {
var el = $(event.target);
alert(el.data('id'));
});
ul.append(li);
}
</script>
var a = Math.floor(Math.random() * 10);
var b = Math.floor(Math.random() * 10);
var answer;
while (answer != (a + b)) {
answer = prompt(a + '+' + b + '= ?');
}
console.log("정답입니다.");
function max(arr) {
var _max = -99999; // 아주 작은수
for (var i of arr) {
if (i > _max) {
_max = i;
}
}
return _max;
}
console.log("가장 큰 수는 " + max([5, 7, 10, 2, 8]) + "입니다.");
<ul id="list"></ul>
<script>
var list = document.getElementById("list");
var products = ['데스크탑', '모니터', '노트북', '스피커', '마우스'];
var html = '';
for (var product of products) {
html += '<li>' + product + '</li>';
}
list.innerHTML = html;
</script>
var score = prompt("성적을 입력하세요.");
if (score >= 90) {
console.log("A");
} else if (score >= 80) {
console.log("B");
} else if (score >= 70) {
console.log("C");
} else {
console.log("D");
}
switch
break
var language = prompt("언어를 입력해주세요.");
switch(language) {
case "korean":
alert("안녕하세요.");
break;
case "english":
alert("Hello.");
break;
case "spanish":
alert("Hola.");
break;
default:
alert("지원하지 않는 언어입니다.");
break;
}
function operator(x, y, func) {
return func(x, y);
}
function add(a, b) { return a+b; }
function substract(a, b) { return a-b; }
console.log(operator(4, 2, add));
console.log(operator(4, 2, substract));
<script>
var element = document.getElementById("text");
setTimeout(function() {
element.innerText = '삭제됨';
}, 3000);
</script>
today 에 저장되어 있는 날짜의 요일을 나타내는 0에서 6 사이의 수를 반환. 0은 일요일
전자시계 만들기
<p id="text" class="content"></p>
<script>
var element = document.getElementById("text");
var tick = function() {
var now = new Date();
var time = now.getHours() + '시' +
now.getMinutes() + '분' +
now.getSeconds() + '초';
element.innerText = time;
};
setInterval(tick, 1000);
</script>
