지금부터 new Date()를 사용하여 시간을 불러올 것이다. const clock = document.querySelector("#clock"); function getClock() { const date = new Date(); const hours = String(date.getHours()).padStart(2, "0"); const minutes = String(date.getMinutes()).padStart(2, "0"); const seconds = String(date.getSeconds()).padStart(2, "0"); clock.innerText = `${hours}:${minutes}:${seconds}`; } getClock(); setInterval(getClock, 1000..
아래와 같은 메서드를 통해 localStorage에 item을 생성, 삭제, 조회 할 수 있다. 1. 생성 localStorage.setItem("username", "Mike"); 순서대로 key, value 값으로 아이템을 생성해준다. 2. 삭제 localStorage.removeItem("username"); key값을 통해 아이템 삭제 가능 3. 조회 localStorage.getItem("username"); key 값을 통해 아이템 조회 가능
// html 코드 // JS 코드 const loginForm = document.querySelector(".login-form"); const loginInput = loginForm.querySelector("input"); function onLoginSubmit(e) { // e -> 첫번째 argument(매개변수) e.preventDefault(); console.log(e); const username = loginInput.value; console.log(username); } loginForm.addEventListener("submit", onLoginSubmit); loginForm.addEventListener("submit", onLoginSubmit); -> submit 이..
우선, classList란?? 말그대로 html태그의 classList이다. 클래스 목록이라고 생각하면된다. 즉, html의 클래스로는 여러개의 클래스 명들이 들어올 수 있다. 우리는 다음과 같이 코드를 작성하여 글씨를 클릭할때 마다 색깔을 변하게 해주는 코드를 짰다 // JS 코드 const h1 = document.querySelector(".hello h1"); function handleTitleClick() { const clickedClass = "active"; if (h1.classList.contains(clickedClass)) { h1.classList.remove(clickedClass); } else { h1.classList.add(clickedClass); } } h1.addE..
JS는 이미 html과 연결되어있다. 콘솔창에 document라고 치면 html 속성들을 불러올 수 있음 innerHTML vs innerText element.innerText; 이 속성은 element 안의 text 값들만을 가져옵니다. element.innerHTML; innerText와는 달리 innerHTML은 element 안의 HTML이나 XML을 가져옵니다. element.innerText = "A"; element.innerText에 html을 포함한 문자열을 입력하면, html코드가 문자열 그대로 element안에 포함됩니다. element.innerHTML = "A"; 위와 같이 element.innerHTML 속성에 html코드를 입력하면, html element가 element안에..
const calculator = { add: function (a, b) { console.log(a + b); }, minus: function (a, b) { console.log(a - b); }, multiple: function (a, b) { console.log(a * b); }, divide: function (a, b) { console.log(a / b); }, power: function (a, b) { console.log(a ** b); }, }; calculator.add(10, 5); calculator.minus(10, 5); calculator.multiple(10, 5); calculator.divide(10, 5); calculator.power(10, 5); 위와 같..

Mixed content에러 길찾기 버튼을 클릭 시 모달창으로 감싸서 모달창 안에서 띄워주도록 설정을 함. -> 이 경우 ```` 이란 태그를 사용하게 되는데 코드에서는 HTTPS를 사용하고 있지만 카카오맵 서비스가 자동으로 HTTP로 리다이렉트 되는 경우, 이는 카카오맵 측의 설정또는 동작 방식 때문이다. 따라서 모달창으로 띄워주는 것이 아닌 새창을 띄워지게 만듦으로써 모바일 입장에서는 엘리스랩 찾기 버튼 클릭시 카카오맵 어플을 자동실행시켜주어 길찾기 하도록 해결. 단, 모바일 safari를 이용하게 될 경우 팝업차단 상태로 어플이 실행안될 수 있음 해결방법 설정 열기: 모바일 기기에서 '설정' 앱을 열어주세요. Safari 선택: 설정 메뉴에서 'Safari'를 찾아 선택해주세요. 팝업 차단 해제: ..

데드락(Deadlock) 운영체제에서 데드락(교착상태)이란, 시스템 자원에 대한 요구가 뒤엉킨 상태이다. 즉, 둘 이상의 프로세스가 다른 프로세스가 점유하고 있는 자원을 서로 기다릴 때 무한 대기에 빠지는 상황을 일컫는다. 프로세스1은 자원 A가 필요하다. 자원 A는 프로세스2에 의해 잠겨있다. 프로세스2는 자원 B가 필요하다. 자원 B는 프로세스1에 의해 잠겨있다. 어느 한 프로세스를 강제적으로 종료하지 않으면 컴퓨터가 정지된 것처럼 어떤 작업도 수행할 수 없다. 데드락(Deadlock)의 발생조건 데드락이 발생하기 위해선 아래 4가지 조건이 모두 충족해야 한다. 하나라도 만족하지 않는다면 "절대" 데드락이 발생 하지 않는다. 상호 배제(Mutual exclusion) 한 리소스는 한번에 한 프로세스만..
- Total
- Today
- Yesterday
- 스코프
- setinterval
- Let
- useState
- setitem
- react
- 데드락
- e.preventDefault()
- 브라우저 저장소
- 호이스팅
- new Date()
- Hook
- getCurrentPosition
- Return
- localStorage
- const
- classList
- removeitem
- 얕은복사
- getitem
- console.log
- 교착상태
- var
- padStart
- createElement
- Navigator
- setTimeout
- innerText
- Geolocation
- 깊은복사
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |