Code Playground

< h1 > Code Playground </ h1 >

# 나이 계산기 input박스에 태어난 연도를 입력하고 버튼을 클릭하면 아래에 나이가 출력된다. 입력하지 않고 버튼을 클릭했을 경우 "태어난 연도를 입력하세요" 문구 출력하고 input박스가 focus된다. dom, 연산자 연습 HTML: SUBMIT 당신의 나이는: SCRIPT: document.querySelector('#testAgeBtn').addEventListener('click', function() { var birthYear = document.querySelector('#testUserYear').value; if(! birthYear) { alert('태어난 연도를 입력하세요'); document.querySelector('#testUserYear').focus(); } else { ..

1. 기초 산술연산자 분류 연산자 이름 기호 설명 사칙 연산자 더하기 + 두 값을 더한다. 빼기 - 앞의 값에서 뒤의 값을 뺀다. 곱하기 * 두 값을 곱한다. 나누기 / 앞의 값을 뒤의 값으로 나눈다. 나머지 연산자 나머지 % 앞의 값을 뒤의 값으로 나눈 나머지 값 증감 연산자 증가 ++ 변수의 값을 1 증가 감소 -- 변수의 값을 1 감소 # 증감연산자의 위치 증감연산자가 피연산자 앞에 위치 ex) ++a 전체 수식 처리하기 전에 적용됨 증감연산자가 피연산자 뒤에 위치 ex) a++ 전체 수식의 처리가 끝난 뒤 적용됨 var a = 10; var b = a++ + 5; console.log(a, b);// a = 11, b = 15가 출력됨 var a = 10; var b = ++a + 5; conso..

-해당 문제는 codewars사이트의 level5 문제입니다. (1~8단계 중 8단계가 가장 쉬운 레벨)- [문제] Once upon a time, on a way through the old wild west,… … a man was given directions to go from one point to another. The directions were "NORTH", "SOUTH", "WEST", "EAST". Clearly "NORTH" and "SOUTH" are opposite, "WEST" and "EAST" too. Going to one direction and coming back the opposite direction is a needless effort. Since this is..

-해당 문제는 codewars사이트의 level5 문제입니다. (1~8단계 중 8단계가 가장 쉬운 레벨)- [문제] Write a function, which takes a non-negative integer (seconds) as input and returns the time in a human-readable format (HH:MM:SS) HH = hours, padded to 2 digits, range: 00 - 99 MM = minutes, padded to 2 digits, range: 00 - 59 SS = seconds, padded to 2 digits, range: 00 - 59 The maximum time never exceeds 359999 (99:59:59) You can ..

스크롤이 몇 퍼센트 움직였는지 구하는 방법: var percent = ($(window).scrollTop() / ($(document).height() - $(window).height())) * 100;

만드는데 거의 3일 정도 걸렸던 스톱워치이다.. 휴.. 처음 간단하게 시작 / 스톱 버튼을 만들었을 때는 그렇게 어렵지 않았다. 문제는 재시작, 기록, 리셋 등등의 기능을 넣으면서부터 꼬이기 시작하고 시간이 뒤죽박죽 난리가 나고..;; 일단 HTML태그는 다음과 같다. 00 : 00 . 00 START STOP 내가 최초로 생각한 방법은 자바스크립트의 Timestamp값을 이용하는 것이었다. 내가 생각한 스톱워치 알고리즘을 적어보면 다음과 같다. 시작 버튼을 누르는 순간에 변수A에 현재시간을 불러오고 그 시간을 timestamp값으로 저장한다. 그리고 시작 시점부터 1ms 마다 계속해서 현재시간의 timestamp값을 새로 불러와 B에 저장한다. B에서 A를 뺀 timestamp값을 분, 초, 밀리초로 ..

오늘은 간단하게 자바스크립트를 이용하여 시계를 만들어보려고 한다. 먼저 HTML과 CSS 코드는 다음과 같다. : . . . * { box-sizing: border-box; } .clock { width: 300px; height: 300px; margin: auto; padding-top: 75px; background: #000; text-align: center; } .clock .time_box { width: 100%; padding-left: 10px; } .clock span { color: #fff; } .txt_lg { font-size: 75px; } .txt_sm { font-size: 20px; } .date_box { font-size: 15px; } #day { display:..

1번 탭 2번 탭 3번 탭 Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan american a..

-해당 문제는 codewars사이트의 level5 문제입니다. (1~8단계 중 8단계가 가장 쉬운 레벨)- [문제] Complete the function/method so that it takes CamelCase string and returns the string in snake_case notation. Lowercase characters can be numbers. If method gets number, it should return string. // returns test_controller toUnderscore('TestController'); // returns movies_and_books toUnderscore('MoviesAndBooks'); // returns app7_tes..

위와 같은 리스트를 html, css로 표현할 때,실제 태그에 숫자를 적지 않고 가상클래스에 counter()를 사용하여 표현할 수 있다. 1. counter-reset : 카운터이름 시작숫자 /* Set "my-counter" to 0 */ counter-reset: my-counter; /* Set "my-counter" to -1 */ counter-reset: my-counter -1; /* Set "counter1" to 1, and "counter2" to 4 */ counter-reset: counter1 1 counter2 4; /* Cancel any reset that could have been set in less specific rules */ counter-reset: none;..