웹 공부일지

웹 표준, 웹 호환성, 웹 접근성에 대한 고찰 안녕하세요, 오늘은 웹 표준, 웹 접근성, 웹 호환성에 대한 이야기를 해보려 합니다. 모든 웹사이트는 정해진 웹 표준을 따라야 합니다. 그리고 웹 호환성을 준수한 사이트를 만드려면, 어떠한 브라우저에서도 웹사이트가 동일한 동작을 하도록 해야 합니다. 우리가 웹 표준과 웹 호환성을 준수하여 웹사이트를 제작한다면, 누구나 편하게 이용 가능한 웹 접근성이 높은 사이트를 만들 수 있습니다. 즉, 웹 호환성과 웹 접근성의 개념에는 웹 표준이 포함되어 있습니다. 웹 표준 웹 표준이란 img 태그의 적절한 alt속성을 추가, semantic태그를 이용할 때, 제목을 꼭 붙여준다, img태그를 사용할 때 figure 태그와 같이 사용한다, meta 태그를 적극 사용한다던가..

1 단계 : 소수 만들기 코딩테스트 연습 > Summer/Winter Coding(~2018) > 소수 만들기 문제 설명 주어진 숫자 중 3개의 수를 더했을 때 소수가 되는 경우의 개수를 구하려고 합니다. 숫자들이 들어있는 배열 nums가 매개변수로 주어질 때, nums에 있는 숫자들 중 서로 다른 3개를 골라 더했을 때 소수가 되는 경우의 개수를 return 하도록 solution 함수를 완성해주세요. 제한사항 nums에 들어있는 숫자의 개수는 3개 이상 50개 이하입니다. nums의 각 원소는 1 이상 1,000 이하의 자연수이며, 중복된 숫자가 들어있지 않습니다. 입출력 예 nums result [1,2,3,4] 1 [1,2,7,6,4] 4 입출력 예 설명 입출력 예 #1 [1,2,4]를 이용해서 ..

요소선택 자바 스크립트에서 html요소를 선택해서 제어할 수 있는데, 이러한 선택자들을 요소선택자라고 한다. 선택할 요소로는 태그, 클래스, 아이디 등을 선택할 수 있습니다. 이러한 선택자 API들을 이용해 DOM에서 Element 노드를 선택자를 통해 빠르고 쉽게 가져올 수 있는 메서드를 제공합니다. ▶ 요소를 직접 선택하는 메서드 메서드 설명 getElementById() document.getElementById('content')일 경우, HTML 요소 중 id 속성이 'content'인 요소를 선택합니다. getElementsByClassName() document.getElementByClassName('menu')일 경우 HTML 요소 중 class명이 'menu'인 요소들을 선택합니다. g..

1 단계 : 내적 코딩테스트 연습 > 월간 코드 챌린지 시즌1 > 내적 문제 설명 길이가 같은 두 1차원 정수 배열 a, b가 매개변수로 주어집니다. a와 b의 내적을 return 하도록 solution 함수를 완성해주세요. 이때, a와 b의 내적은 a[0]*b[0] + a[1]*b[1] + ... + a[n-1]*b[n-1] 입니다. (n은 a, b의 길이) 제한사항 a, b의 길이는 1 이상 1,000 이하입니다. a, b의 모든 수는 -1,000 이상 1,000 이하입니다. 입출력 예 a b result [1,2,3,4] [-3,-1,0,2] 3 [-1,0,1] [1,0,-1] -2 입출력 예 설명 입출력 예 #1 a와 b의 내적은 1*(-3) + 2*(-1) + 3*0 + 4*2 = 3 입니다. ..

1 단계 : 음양 더하기 코딩테스트 연습 > 월간 코드 챌린지 시즌2 > 음양 더하기 문제 설명 어떤 정수들이 있습니다. 이 정수들의 절댓값을 차례대로 담은 정수 배열 absolutes와 이 정수들의 부호를 차례대로 담은 불리언 배열 signs가 매개변수로 주어집니다. 실제 정수들의 합을 구하여 return 하도록 solution 함수를 완성해주세요. 제한사항 absolutes의 길이는 1 이상 1,000 이하입니다. absolutes의 모든 수는 각각 1 이상 1,000 이하입니다. signs의 길이는 absolutes의 길이와 같습니다. signs[i] 가 참이면 absolutes[i] 의 실제 정수가 양수임을, 그렇지 않으면 음수임을 의미합니다. 입출력 예 absolutes signs result ..

1 단계 : 없는 숫자 더하기 코딩테스트 연습 > 월간 코드 챌린지 시즌3 > 없는 숫자 더하기 문제 설명 0부터 9까지의 숫자 중 일부가 들어있는 정수 배열 numbers가 매개변수로 주어집니다. numbers에서 찾을 수 없는 0부터 9까지의 숫자를 모두 찾아 더한 수를 return 하도록 solution 함수를 완성해주세요. 제한사항 1 ≤ numbers의 길이 ≤ 9 0 ≤ numbers의 모든 원소 ≤ 9 numbers의 모든 원소는 서로 다릅니다. 입출력 예 numbers result [1,2,3,4,6,7,8,0] 14 [5,8,4,0,6,7,9] 6 입출력 예 설명 입출력 예 #1 5, 9가 numbers에 없으므로, 5 + 9 = 14를 return 해야 합니다. 입출력 예 #2 1, 2..

1 단계 : 크레인 인형뽑기 게임 코딩테스트 연습 > 2019 카카오 개발자 겨울 인턴십 > 크레인 인형뽑기 게임 문제 설명 게임개발자인 "죠르디"는 크레인 인형뽑기 기계를 모바일 게임으로 만들려고 합니다. "죠르디"는 게임의 재미를 높이기 위해 화면 구성과 규칙을 다음과 같이 게임 로직에 반영하려고 합니다. 게임 화면은 "1 x 1" 크기의 칸들로 이루어진 "N x N" 크기의 정사각 격자이며 위쪽에는 크레인이 있고 오른쪽에는 바구니가 있습니다. (위 그림은 "5 x 5" 크기의 예시입니다). 각 격자 칸에는 다양한 인형이 들어 있으며 인형이 없는 칸은 빈칸입니다. 모든 인형은 "1 x 1" 크기의 격자 한 칸을 차지하며 격자의 가장 아래 칸부터 차곡차곡 쌓여 있습니다. 게임 사용자는 크레인을 좌우로 ..

변수 변수는 데이터를 저장하는 공간이고, 변수는 크게 전역변수와 지역변수로 나눌 수 있습니다. 전역변수 함수 블록{} 밖이나 안에서 자유롭게 사용할 수 있습니다. var 변수; function 함수() { 실행문 } 지역변수 함수 블록{} 내에서만 사용할 수 있습니다. function 함수() { var 변수; 실행문 } 예시 1 함수 내부에서 전역변수 kor의 값을 바꿉니다. var kor = 90; function getScore(){ kor = 100; // 전역변수의 값을 바꿈 console.log(kor); // 100 } getScore(); console.log(kor); // 100 결과 확인하기 100 100 예시 2 함수의 지역변수로 사용하려면 함수 내부에서 변수의 선언 키워드를 통해서..

1 단계 : 로또 최고순위와 최저순위 코딩테스트 연습 > 2020 카카오 인턴십 > 키패드 누르기 문제 설명 스마트폰 전화 키패드의 각 칸에 다음과 같이 숫자들이 적혀 있습니다. 이 전화 키패드에서 왼손과 오른손의 엄지손가락만을 이용해서 숫자만을 입력하려고 합니다. 맨 처음 왼손 엄지손가락은 * 키패드에 오른손 엄지손가락은 # 키패드 위치에서 시작하며, 엄지손가락을 사용하는 규칙은 다음과 같습니다. 엄지손가락은 상하좌우 4가지 방향으로만 이동할 수 있으며 키패드 이동 한 칸은 거리로 1에 해당합니다. 왼쪽 열의 3개의 숫자 1, 4, 7을 입력할 때는 왼손 엄지손가락을 사용합니다. 오른쪽 열의 3개의 숫자 3, 6, 9를 입력할 때는 오른손 엄지손가락을 사용합니다. 가운데 열의 4개의 숫자 2, 5, 8..

1 단계 : 숫자 문자열과 영단어 코딩테스트 연습 > 2021 카카오 채용연계형 인턴십 > 숫자 문자열과 영단어 문제 설명 네오와 프로도가 숫자놀이를 하고 있습니다. 네오가 프로도에게 숫자를 건넬 때 일부 자릿수를 영단어로 바꾼 카드를 건네주면 프로도는 원래 숫자를 찾는 게임입니다. 다음은 숫자의 일부 자릿수를 영단어로 바꾸는 예시입니다. 1478 → "one4seveneight" 234567 → "23four5six7" 10203 → "1zerotwozero3" 이렇게 숫자의 일부 자릿수가 영단어로 바뀌어졌거나, 혹은 바뀌지 않고 그대로인 문자열 s가 매개변수로 주어집니다. s가 의미하는 원래 숫자를 return 하도록 solution 함수를 완성해주세요. 참고로 각 숫자에 대응되는 영단어는 다음 표와..