LocalStorage 에 입력한 user_id 를 서버 단의 유효시간과 동일하게 하기 위해 아래와 같은 형태로 아이디, 만료시간을 등록하였다.{"value":"sylee","expireTime":1735917224128} 이 방법의 단점은 해당 localStorage 의 데이터에 접근하기 위해서는 아래 함수를 통해 JSON.parse 후 값을 꺼내줘야 한다는 거다. const getUserId = (key) => { const item = localStorage.getItem(key); if (!item) return null; const {value, expireTime} = JSON.parse(item); return value;} LocalSt..
방명록 만들기, 작성 기능을 구현해보자. 작성자, 글 비밀번호, 내용을 작성하고 작성 버튼을 누르면 새로운 영역에 글이 작성되는 기능이다. 방명록 작성자 글 비밀번호 내용 작성 바디에서 작성자, 비밀번호, 내용 의 값을 사용자에게 받아 "작성" 버튼을 이용해 함수 a() 를 불러낸다. (onclick = "a()") 에서 각 값의 이름으로 접근해 값을 받아 변수에 담는다. 값들을 파라메터에 담아 mkDiv 함수를 불러낸다 mkDiv 는 div 태그에 감싸서 내용을 프린트 하기 위해 만들었다. 새로운 div 태그를 만들어 영역을 추가한다. 새 div 태그에 id를 지정하고 비밀번호를 추가한다. 아이디가 겹치지 않도록 cnt 를 추가한다. 생성된 div 에 출력할 내용을 담은 변수 html 을 초기화해준다...
HTML DOM Documnet Object Model (문서 객체 모델) HTML DOM 모델은 HTML등의 문서를 위한 객체의 인터페이스라고 보면 된다. DOM은 아래와 같은 구조로 표현된다. DOM은 HTML의 요소를 받고, 변경하고, 추가하고, 삭제하는 방법 등을 제공한다. 1. 요소 추출 메서드 id를 받아오는 메서드는 아이디 한개만 받아오니 문법 사용에 주의해야한다. document.getElementById("아이디"); //요소 한개 (id) 반환 //아이디는 중복되지 않으니 element, s를 붙이지 않는다. document.getElementsByTagName("태그명"); // 등의 태그. 동일한 태그명을 찾아서 배열에 담아 반환 document.getElementsByClassNa..
폼 양식 자바 스크립트 (JS) 로 불러내기 폼 양식을 자바 스크립트로 불러오는 문법이다. text, password, number 폼 받기 변수 html 에 위 문법을 사용해 값을 받고 html 변수를 출력하는 코드이다. 폼 양식 종류 id : pwd : phone :
변수 계속 변하는 값 var 변수명; let 변수명; //지역변수 (블록 내/외) 가능 //전역변수. 어느 함수나 사용 가능 var a = 1; let b = 2; function f1() { //함수 호출 안하면 실행 안된다 alert("f1()a:" + a); //1 alert("f1()b:" + b); //2 var x = 3; //지역변수. f1() 함수에서만 사용이 가능하고 f2()에서 쓰지 못한다. let y = 4; alert("f1()t:" + t); //변수를 정의하지 않으면 에러 발생 alert("f1()x:" + x); //3 alert("f1()y:" + y); //4 } function f2() { alert("f2()a:" + a); //1 alert("f2()b:" + b); ..
자바 스크립트에서 구구단을 구현하는 방식은 다양하다. 1. for 문 이용한 방식 구구단을 아래와 같은 형식으로 JS를 이용해 프린트해보자 코드 결과 2. 함수 이용한 방식 function 안에 for문을 넣어 body에서 호출하면 된다. 자바 스크립트 함수 정의 코드 결과 ⬇️ 자바 스크립트 문법 보러가기 TISTORY 나를 표현하는 블로그를 만들어보세요. www.tistory.com
