Javascript28 JavaScript<마우스 클릭 연습> 마우스 클릭 연습 1.아래와 같이 이미지 객체 배열로 사진 이미지 저장해두고 let img = new Image(); img.src="media/donkey.png" 2.document.images[] 문서에 있는 모든 이미지를 담고 있다고 해서 활용하니 코드가 훨씬 더 짧아졌다. 3.아래 테이블 표 만드는 것은 일일이 하지 않고 element 생성해서 할 수 있다고 하는데 다음에 한 번 시도해볼 생각 2023. 2. 22. 자바스크립트 <겜블링 게임> 갬블링 게임 각 숫자를 클릭하면 0에서 2사이의 난수로 바뀝니다. 모두 같은 수가 나오면 승리합니다. 0 0 0 직접 실행해보기(한 개만 눌러도 fail이 뜨는 버그 확인) HTML 삽입 미리보기할 수 없는 소스 결과화면 1.초기 2.성공했을 때 2023. 2. 20. 템플릿 리터럴(Template literals) - 백틱(`)활용 템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴이다. 백틱은 우선 맥북에서는 option키과 원화키를 같이 누르면 생긴다. 백틱을 사용하면 줄바꿈과 표현식을 사용할 때 일반 String과 차이점이 생기는데 아래에서 예를 통해 살펴보자면 줄바꿈 기능 우선 일반적으로 할 때 개행문자를 이용해서 이렇게 나타내는 반면에 console.log("첫번째 줄\n" + "두번째 줄"); //첫번째 줄 //두번째 줄 백틱을 사용하면 console.log(`첫번째 줄 + 두번째 줄`); //첫번째 줄 //두번째 줄 위와같이 개행문자 없이 같은 결과를 얻을 수 있다. 표현식 삽입 일반적으로 표현식 삽입할 때 +를 이용해서 아래와 같이 표현하는데 var a = 1; var b = 2; console.log("3" + .. 2023. 1. 28. [2022]Local Storage 알아보기 Local Storage는 웹브라우저에 있는 작은 DB라고 생각하면 되는데 우선 개발자 도구 들어가서 직접 저장된 데이터를 확인할 수 있다. 왼쪽 보면 Storage 아래에 Local Storage를 확인할 수 있는데 처음에는 저장된 것이 없으니 Key와 Value 값이 모두 비어있는 게 정상이다. 값을 채워넣기 위해서는 텍스트 에디터를 이용해서 Key와 Value값을 넣어줄 수 있는데 localStorage.setItem(key, value); 직접 개발자도구에 있는 Console에서 저장할 수 있는데 값을 입력하면 undefined라고 나오는데 상관없다. 저장된 것을 확인했으면 꺼내는 방법은 아래와 같다. 주의할 점은 ""큰 따옴표 안에 Key의 이름을 그대로 입력해야 Value를 꺼낼 수 있다. l.. 2022. 12. 2. 이전 1 2 3 4 5 다음