presentLee

const todo = document.querySelector("#todo") const todoInput = todo.querySelector("input"); const todos = []; function save(){ localStorage.setItem("todos",JSON.stringify(todos)); } function pressButton(event){ const list = (event.target.parentElement); list.remove(); } function putlist(value){ const list = document.createElement("li"); const span = document.createElement("span"); const button =..

웹/js 2022. 6. 30. 22:19

const todo = document.querySelector("#todo") const todoInput = todo.querySelector("input"); function putlist(value){ const list = document.createElement("li"); const span = document.createElement("span"); span.innerText=value; list.appendChild(span); const ul = document.querySelector("#list"); ul.appendChild(list); } function addList(event){ event.preventDefault(); const input = todoInput.value;..

웹/js 2022. 6. 29. 22:19

const phrase = [ { one:"It is", two:" test" } , { one:"It's", two:" TEST" } ] const image=[ "0.jpg", "1.jpg", "2.jpg" ] const put = document.querySelector(".ph span:first-child"); const put1 = document.querySelector(".ph span:last-child"); const num = phrase[Math.floor(Math.random()*phrase.length)]; put.innerText = num.one put1.innerText = num.two const num1=image[Math.floor(Math.random()*3)] co..

웹/js 2022. 6. 28. 18:10

setTimeout("함수", ms) refresh 후 몇 ms 후에 함수를 작동시킴. setInterval("함수", ms) 몇 ms 마다 함수를 반복실행. new date(); 시간이 담긴 객체. new date().getHours() 와 같이 사용. const clock = document.querySelector(".clock"); function getTimes() { const time = new Date(); const hour = String(time.getHours()).padStart(2,"0"); const min = String(time.getMinutes()).padStart(2,"0"); const sec = String(time.getSeconds()).padStart(2,"0..

웹/js 2022. 6. 28. 15:00

localstorage.setItem("이름","내용") 으로 저장 localstorage.getItem("이름") 으로 읽을 수 있다. css에서 display: none; 시에 숨길 수 있음. const ok1= document.querySelector("#login"); const link = document.querySelector("h1"); const ok2= document.querySelector("#login input"); function whenEvent(event) { event.preventDefault(); const usern = ok2.value; localStorage.setItem("value2",usern); ok1.classList.add("hidden"); IH(us..

웹/js 2022. 6. 27. 18:19

string의 길이 string.length const ok1= document.querySelector("#login input"); const ok2 = document.querySelector("#login button") function whenEvent() { if(ok1.value.length < 15) { alert("too short"); } console.log(ok1.value); } ok2.addEventListener("click",whenEvent); 위와 같은 기능은 html 자체로 구현 가능 Input을 으로 묶고 내부에 required 조건으로 칸을 채워야 하거나, maxlength="15" 와 같이 할 수 있음. 그렇지만 이런 기능을 사용 했을때 버튼을 누르면 새로고침이 된..

카테고리 없음 2022. 6. 27. 02:28

Log in html 단에 id로 묶은 입력창과 버튼. const ok1= document.querySelector("#login input"); const ok2 = document.querySelector("#login button") function whenEvent() { console.log(ok1.value); } ok2.addEventListener("click",whenEvent); 해당 id에 있는 input과 button을 각각 할당 버튼에 click 이벤트가 발생했을 때 input에 입력된 값을 콘솔로 보여준다.

웹/js 2022. 6. 26. 20:57

우리가 인터넷에 접속하고, 이용할 때 서비스 뒤에서는 어떤 일들이 일어나고 있을까. 인터넷 강의 사이트에 접속 할 때 우리의 디바이스는(클라이언트) 서버에 강의 정보를 요청 클라이언트를 상대하는 서버가 아닌 다른 역할의 서버도 존재 할 수 있음. (WAS - Web Application sesrver) 그후 서버는 클라이언트에게 정보를 보내줌. 조건을 만족하지 않는(로그인을 하지 않거나 권한이 없는) 클라이언트에게는 서버가 요청을 거절 클라이언트-서버 구조 클라이언트-서버 모두 컴퓨터의 형태이므로 서로의 역할이 바뀔 수 있음 node spring 등등 설치를 해서 서버의 역할을 하게 만드는 것. 서버를 직접 설치 (On-Premise) or Cloud 서비스 수많은 서버들이 상호 연결/소통되고 있다. 요..

웹 2022. 6. 26. 17:11