분류 전체보기 검색 결과

224 개의 검색 결과가 있습니다.

Frontend/JavaScript

[JS] 자바스크립트 form 이벤트

자바스크립트에서 form의 데이터가 변경될 때 실행되는 이벤트는 change, input, cut, copy, paste가 있다. 1. Change change 이벤트는 요소 변경이 끝나면 발생한다. 텍스트 입력인 경우에는 요소 변경이 끝날 때가 아니라 포커스를 잃을 때 이벤트가 발생한다. 아래 텍스트 입력 필드에 글자를 입력하는 동안에는 이벤트가 발생하지 않지만, 버튼을 클릭하는 등의 동작을 통해 포커스를 다른 곳으로 옮기는 순간 change 이벤트가 발생한다. select와 checkbox, radio는 선택 값이 변경된 직후에 이벤트가 발생한다. 선택하세요. 옵션 1 옵션 2 옵션 3 2. input input 이벤트는 사용자가 값을 수정할 때마다 발생하고, 값을 변경시키지 않는 키보드 입력이나 동..

2021. 8. 15. 19:33

Frontend/JavaScript

[JS] 자바스크립트 소수점 다루기

자바스크립트에도 숫자를 변환하는 함수가 있고, 대표적으로 Math 객체를 사용하는 방법이 있다. Math 객체에는 값을 처리하는 다양한 메소드(함수)들이 존재한다. Math.ceil() // 소수점 올림, 정수 반환 Math.floor() // 소수점 버림, 정수 반환 Math.round() // 소수점 반올림, 정수 반환 ▶ Math.floor() : 소수점 올림 var round = 99.11; alert(Math.ceil(round)); // 100 출력, 올림 적용 ▶ Math.floor() : 소수점 버림 var round = 99.11; alert(Math.floor(round)); // 99 출력, 버림 적용 ▶ Math.round() : 소수점 반올림 var round = 99.5; ale..

2021. 8. 14. 16:13

Frontend/JavaScript

[JS] Tag, Class, id로 원하는 요소 찾기

2021.08.12 - [개발/JavaScript] - [JS] 자바스크립트 부모, 형제, 자식 노드 찾기 앞선 포스팅과 비슷하게 DOM 작업을 할 때 Tag, Class, id로 원하는 요소를 찾는 방법이다. 1. getElementsByTagName getElementsByTagName는 해당 태그가 적용된 엘리먼트를 찾는다. //p태그를 가진 i번째 요소를 선택 var findByTag = document.getElementsByTagName( 'p' )[i]; //p태그를 가진 i번째 요소안의 strong 태그를 가진 요소를 선택 var findByTag2 = findByTag.getElementsByTagName( 'strong' ); ); 2. getElementsByClassName getE..

2021. 8. 13. 01:27

Frontend/JavaScript

[JS] 자바스크립트 부모, 형제, 자식 노드 찾기

(참고) 2021.08.13 - [개발/JavaScript] - [JS] Tag, Class, id로 원하는 요소 찾기 자바스크립트에서 DOM 작업을 할 때 부모, 형제, 자식 노드를 찾는 방법이다. 1. childNodes childNodes는 자식 노드를 찾을때 사용한다. ( 제이쿼리: https://api.jquery.com/children/ ) 모든 자식을 찾을때에는 childNodes를 사용하며 배열 형태로 저장된다. var criteria = document.getElementById('criteria'); var all = criteria.childNodes; // 모든 자식노드 var firstNode = criteria.firstChild; // 첫번째 자식노드 var lasaNode =..

2021. 8. 12. 00:50

Frontend/JavaScript

[JS] 문자열에서 특정 문자 검색

자바스크립트에서 문자열에 특정 문자가 포함되었는지 또는 특정 문자를 찾고자 할 때 사용하는 방법이다. 1. indexOf 포함하고 있는 문자의 인덱스를 반환한다. 해당 문자가 없을 경우에는 -1을 반환한다. var stringVal = "javascript", substring = "java"; stringVal.indexOf(substring) !== -1; 2. includes ES6 이상에서 적용 가능하며, 해당 문자를 포함하고 있으면 true 없으면 false를 반환한다. var stringVal = "javascript", substring = "java"; stringVal.includes(substring); #참고 https://developer.mozilla.org/en-US/docs/W..

2021. 8. 11. 01:40

Frontend/JavaScript

[JS] 클로저(Closure)의 의미와 사용 방법

1. 클로저란? - 클로저란 내부 함수가 정의될 때 외부 함수의 환경을 기억하고 있는 내부 함수를 말한다. - 외부 함수 안에서 선언된 내부 함수는 그 외부 함수의 지역 변수가 함수에 접근하여 사용할 수 있다. - 클로저는 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 특징중에 하나입니다. - 클로저는 함수를 구성하는 코드와 함수가 생성될 당시의 스코프 환경(=렉시컬 환경)으로 구성된다. - 스코프 환경을 알고 있기 때문에, 함수가 생성될때의 모든 변수를 기억해 두었다가 함수가 호출될 때 사용할 수 있다. 2. 사용이유 - 클로저는 메모리 차원에서 손해를 볼 수 있지만 이점이 많다. 상태유지: 현재 상태를 기억하고 변경된 최신 상태를 유지할 수 있다. 전역 변수 사용 억제: 상태 변경이..

2021. 8. 10. 01:11