전체53 [Javascript] checkbox is checked / 체크 여부 확인 / 스크롤 막기 메뉴 버튼을 만들 때 checkbox의 체크 여부를 통해 메뉴가 열리고 닫히는 애니메이션을 만들었다. 문제는 메뉴가 열리고 나서도 스크롤이 계속 진행되었는데 이 부분은 스크립트로 처리하였다. 메뉴는 따로 스크롤이 필요 없을 만큼 짧기 때문에 body에서 스크롤을 막아주었다. .hidden { height:100%; min-height:100%; overflow:hidden !important; touch-action:none; } 이 css가 body에 적절하게 들어갈 수 있도록 스크립을 짜면 끝! 문제는 체크 여부 스크립을 어떻게 짜야하는지 감이 오지 않아 서치 해보았다. https://stackoverflow.com/questions/9887360/how-can-i-check-if-a-checkbox.. 2022. 9. 27. [코딩 테스트 연습] 자릿수 더하기 (javascript) 문제 자연수 N이 주어지면, N의 각 자릿수의 합을 구해서 return 하는 solution 함수를 만들어 주세요. 예를 들어 N = 123이면 1 + 2 + 3 = 6을 return 하면 됩니다. 풀이 function solution(n) { const numToString = n.toString(); const numsArr = []; for(let i =0; i(sum += value)); return answer; } for문으로 numsArr의 배열의 값을 string 값에서 num값으로 바꾸어 추가시켰다 num.toString() : 숫자를 string으로 변환 Number() : string을 숫자로 변환 CharAt(index) : 문자열에서 특정 인덱스에 위치하는 단일 문자를 반환한다 r.. 2022. 9. 26. [코딩 테스트 연습] 약수의 합 (javascript) 문제 정수 n을 입력받아 n의 약수를 모두 더한 값을 리턴하는 함수, solution을 완성해주세요. 풀이 function solution(n) { let answer = 0; for(i=0; i 2022. 9. 26. [코딩 테스트 연습] 평균 구하기 (javascript) 문제 - 정수를 담고 있는 배열 arr의 평균값을 return하는 함수, solution을 완성해보세요. 풀이 function solution(arr) { let sum = arr.reduce( (prev, curr) => prev + curr); let answer = sum / arr.length; return answer; } - Array.prototype.reduce()를 이용하여 풀었다. Array.prototype.reduce() - 배열의 요소들을 접어서 하나의 값으로 만든다! arr.reduce((previousValue, currentValue, currentIndex, array) => (previousValue += currentValue), initialValue ); //init.. 2022. 9. 26. [코딩 테스트 연습] 짝수와 홀수 (javascript) 문제 - 정수 num이 짝수일 경우 "Even"을 반환하고 홀수인 경우 "Odd"를 반환하는 함수, solution을 완성해주세요. 풀이 function solution(num) { const answer = num % 2 === 0 ? "Even" : "Odd"; return answer; } - 삼항 연산자를 이용하여 풀었다. 삼항 연산자 조건문 ? 조건문이 참일 때 실행 : 조건문이 거짓일 때 실행; 해당 연산자는 if...else문의 대체재로 간단하게 표현할 수 있다. 더 자세한 내용은 아래 링크를 통해서! https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator Conditiona.. 2022. 9. 26. [React] React Tools 1. git 설치 https://git-scm.com/downloads Git - Downloads Downloads macOS Windows Linux/Unix Older releases are available and the Git source repository is on GitHub. GUI Clients Git comes with built-in GUI tools (git-gui, gitk), but there are several third-party tools for users looking for a platform-specific exp git-scm.com git --version // 깃 버전 확인 2. node & npm 설치 - 노드를 설치하면 npm도 저절로 설치 된다 - 너무 .. 2022. 9. 23. [Html] 유용한 tag abbr : 축약어 : 속성 값으로 title이 반드시 들어가야 함 PLZ...한번만 봐줘요 address : (물리적인)주소, url, 이메일, 전화번호, sns 치즈도넛 블로그 https://cheese-donut.tistory.com pre & code : 둘이 같이 사용하지 않아도 됨 : pre - html에서 적은 그대로 화면에 나타남 : code - code를 적을 때 사용 console.log('hello world!'); let a = 2; pre를 사용하면 띄어진 부분까지 전부 화면에 나타남 2022. 6. 2. [Html] Media Audio // 컨트롤러가 생김 // 자동으로 재생 // 자동으로 재생 + 무한 재생 ↑ 사용자들이 어떤 브라우저를 사용할 지 모르기 때문에 최대한 지원할 수 있도록 함 https://developer.mozilla.org/ko/docs/Web/HTML/Element/audio - HTML: Hypertext Markup Language | MDN HTML 요소는 문서에 소리 콘텐츠를 포함할 때 사용합니다. developer.mozilla.org 참고 자료 Video Sorry, your browser doesn't support embedded videos. 2022. 6. 2. [Html] Table 이름 나이 전화번호 김철수 12 01012345678 박지희 16 01012345678 thead : table header tbody : table body tr : table row th : table header td : table data ** th과 td의 개수는 무조건 똑같아야 함 표를 합칠 땐? rowspan="숫자" colspan="숫자" 제목1 제목2 제목3 rowspan="2" colspan="2" ** span을 사용하면 다음줄에서 skip 해도 된다! 월 화 수 목 금 1교시 왕초보 HTML & CSS 모각코 왕초보 HTML & CSS 모각코 왕초보 HTML & CSS 2교시 JavaScript 스킬업 JavaScript 스킬업 3교시 JavaScript 시작반 JavaScript .. 2022. 6. 2. 이전 1 2 3 4 5 6 다음
