전체 글

    [백준/2577번] 숫자의 개수

    www.acmicpc.net/problem/2577 2577번: 숫자의 개수 첫째 줄에 A, 둘째 줄에 B, 셋째 줄에 C가 주어진다. A, B, C는 모두 100보다 같거나 크고, 1,000보다 작은 자연수이다. www.acmicpc.net 풀이 🎉 코드 1 import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import java.util.StringTokenizer; public class Main { public static void main(String[] args) throws IOException { BufferedReader br = new BufferedReader(new In..

    [백준/10818번] 최소, 최대

    https://www.acmicpc.net/problem/10818 10818번: 최소, 최대 첫째 줄에 정수의 개수 N (1 ≤ N ≤ 1,000,000)이 주어진다. 둘째 줄에는 N개의 정수를 공백으로 구분해서 주어진다. 모든 정수는 -1,000,000보다 크거나 같고, 1,000,000보다 작거나 같은 정수이다. www.acmicpc.net 요즘 알고리즘을 자바 문법도 다시 복습할 겸 단계별로 풀어보고 있다. 오늘은 배열! 정말 간단한 문제지만 어떤 방법으로 풀어야 더 효율적인지 알고 싶어서 다양한 방법으로 풀어보고 있다 ㅎㅎ 1. Scanner + for 2. BufferedReader + StringTokenizer 이렇게 2가지 방법으로 풀어봤고 코드는 아래와 같습니다. 코드 1. Scanne..

    [CSS] css: 선택자(Selector)

    CSS 선택자(Selector)란? 말 그대로 선택을 해주는 요소입니다. 선택자를 통해서 요소를 선택하고 스타일을 적용할 수 있습니다. Rule Set HTML안의 특정 요소들을 어떻게 렌더링 할 것인지 브라우저에게 알려주는 CSS 문장입니다. 스타일 규칙이라고 불리며 이런 문장들이 모여 스타일 시트(Style Sheet)를 이룹니다. 선택자(Selector) 종류 1. 전체 선택자 (*): HTML 안의 모든 요소를 선택 2. tag 선택자: 특정 HTML 태그를 선택 3. class 선택자: 요소에 지정된 class 값을 이용해서 요소를 선택 (여러 요소에 사용 가능) 4. id 선택자: 요소에 지정된 id값을 이용해서 요소를 선택 (유일한 값을 가짐) 5. 하위 선택자(E F): E요소의 자손인 F..

    [HTML] data 속성 (data-*)

    HTML에서 지원하는 data 속성은 HTML 요소에 추가 정보를 지정하는 속성이다. 사용 방법도 간단하고 유용하기 때문에 아주 좋은 아이다 ㅎㅎ HTML 문법 모든 엘리먼트에 data- 형식으로 사용할 수 있음 JavaScript에서 접근하기 1. getAttribute()로 접근 console.log(div.getAttribute('data-id')); 2. dataset으로 접근 const div = document.querySelector('div'); const id = div.dataset.id; const pw = div.dataset.pw; console.log(id, pw); 각 속성은 문자열이고 읽거나 쓸 수 있습니다. div.dataset.id = 'eunbinLove'로 설정해서 값..

    [JS] Event Delegation (이벤트 위임)

    이벤트 버블링 - Event Bubbling 이벤트 버블링은 특정 요소에서 이벤트가 발생했을 때 해당 이벤트를 상위 요소로 전달하는 특성입니다. const box1 = document.querySelector('#box1'); const box2 = document.querySelector('#box2'); const box3 = document.querySelector('#box3'); box1.addEventListener('click', () => { console.log('box1 Event'); }); box2.addEventListener('click', () => { console.log('box2 Event'); }); box3.addEventListener('click', () => { ..