Html, Css + js
js : 많은 예제를 할 수 있다.
-------------------------------------------
Javascript로 할 수 있는 것들
1. 이벤트를 제어
2. 계산을 할 수 있다.
빛의 속도 : 300000
태양까지의 거리 : 149,600, 000
지구에서 태양까지 빛의 속도로 가면 몇 시간?
if : 조건문
제어문
===========================
제어문은 프로그램 흐름을 제어할 수 있도록 도와주는 문장을 뜻함.
제어문의 종류로는 조건문, 선택문, 반복문이 있음.
alert("ok"); 데이터를 화면에 표시해 주는 함수
prompt : 데이터를 입력할 수 있는 함수
confirm : 확인, 취소를 반환할 수 있는 함수
조건문 : if, switch
데이터형
number : 숫자
string : 문자
undefined : 데이가 없음(변수형은 선언 되었으나 입력된 값이 없다
boolean : 명제(참, 거짓)
※ location : 인터넷 주소
switch (식 또는 결과) {
case 값 : { 실행; }; break;
case 값 : { 실행; }; break;
case 값 : { 실행; }; break;
case 값 : { 실행; }; break;
case 값 : { 실행; }; break;
}
알고리즘 : 결과를 얻기 위해 합리적이고 논리적으로 작성된 프로그램
*************************************************
let sp, dis, time, min, sec;
sp = 300000;
dis = 149600000;
let k, su, result, h;
window.xxxxonload=function() {
/*
time=parseInt(dis/sp);
min=parseInt(time/60);
sec=parseInt(time%60);
document.write("<br>지구에서 태양까지 걸리는 시간 : " + time + "시간");
document.write("<br>지구에서 태양까지 걸리는 분 : " + min + "분");
document.write("<br>지구에서 태양까지 걸리는 초 : " + sec + "초");
// +, -, *, /, %(나머지연산자)
*/
/*
// 시험을 봐서 60점 이상이면 합격, 미만 불합격
// jum=55;
// if(jum>=60)
// document.write("<br> 합격");
// else
// document.write("<br> 불합격");
jum=document.querySelector(".jum");
disp=document.querySelector(".disp");
result=document.querySelector(".result");
result.addEventListener("click", function() {
su=Number(jum.value);
if(su>=60)
disp.innerHTML="합격";
else
disp.innerHTML="불합격";
})
*/
/*
// 입력한 숫자가 짝수인지, 홀수 인지 알아내는 프로그램 작성
num = prompt("좋아하는 숫자를 입력하세요");
// console.log( num );
if( num%2 == 0)
document.write("<br>짝수 입니다.");
else
document.write("<br>홀수 입니다.");
*/
/*
// 확인을 클릭하면 탈퇴, 취소-탈퇴 안 합니다.
yn=confirm("정말 탈퇴 하시겠습니까?");
if(yn == true)
document.write("<br>탈퇴 처리 되었습니다.");
else
document.write("<br>(탈퇴) 취소 되었습니다.");
*/
/*
// 네이버, 다음, 구글 사이트 이름을 입력하면 사이트 이동
let site = prompt("네이버, 다음, 구글 중 하나를 입력");
let url; // undefined
switch (site) {
case "네이버": url="naver.com"; break;
case "다음": url="daum.net"; break;
case "구글": url="google.com"; break;
default: alert("보기 중에 없는 사이트입니다.");
}
// undefined(flase-거짓)
if(url) { // url 값이 참이다
location.href = "http://www." + url;
}
else { // url 값이 거짓이다
}
*/
result=document.querySelector(".result");
result.addEventListener("click", function() {
// 클릭 후 입력된 값을 읽어들여야 함
// k, su를 클릭 바깥쪽에 쓰면 안됨
k=document.querySelector(".k");
su=Number(k.value);
// console.log(su);
/*
if( su >= 90)
h="A";
else if( su >= 80)
h="B";
else if( su>=70 )
h="C";
else if( su>=60 )
h="D";
else
h="F";
*/
su=parseInt(su/10);
// console.log( su );
switch (su) {
case 10: h="A"; break;
case 9: h="A"; break;
case 8: h="B"; break;
case 7: h="C"; break;
case 6: h="D"; break;
default: h="F"
}
hak=document.querySelector(".hak");
hak.innerHTML = h;
})
}