Javascript
-
if ('visualViewport' in window) { const VIEWPORT_VS_CLIENT_HEIGHT_RATIO = 0.75; window.visualViewport.addEventListener('resize', function (event) { if ( (event.target.height * event.target.scale) / window.screen.height < VIEWPORT_VS_CLIENT_HEIGHT_RATIO ) console.log('keyboard is shown'); else console.log('keyboard is hidden'); }); }
모바일에서 키보드 열림 닫힘 감지if ('visualViewport' in window) { const VIEWPORT_VS_CLIENT_HEIGHT_RATIO = 0.75; window.visualViewport.addEventListener('resize', function (event) { if ( (event.target.height * event.target.scale) / window.screen.height < VIEWPORT_VS_CLIENT_HEIGHT_RATIO ) console.log('keyboard is shown'); else console.log('keyboard is hidden'); }); }
2023.03.28 -
ES6부터 새로 도입된 문자열 표기법입니다. 문자열 생성시 작은따옴표(')나 큰따옴표(") 대신 백틱(`)으로 감싸줍니다. 템플릿 리터럴은 또한 플레이스 홀더를 이용하여 표현식을 넣을 수 있는데, 이는 $와 중괄호( $ {expression} ) 로 표기할 수 있습니다. 템플릿 리터럴의 기본 문법 `string text` // 한줄 표현 `string text line 1 string text line 2` // 개행된 표현 var expression; `string text ${expression} string text` // 변수값 문자열 조합 function tag() { }; tag `string text ${expression} string text` // 함수 호출 Expression inte..
템플릿 리터럴(Template Literal)ES6부터 새로 도입된 문자열 표기법입니다. 문자열 생성시 작은따옴표(')나 큰따옴표(") 대신 백틱(`)으로 감싸줍니다. 템플릿 리터럴은 또한 플레이스 홀더를 이용하여 표현식을 넣을 수 있는데, 이는 $와 중괄호( $ {expression} ) 로 표기할 수 있습니다. 템플릿 리터럴의 기본 문법 `string text` // 한줄 표현 `string text line 1 string text line 2` // 개행된 표현 var expression; `string text ${expression} string text` // 변수값 문자열 조합 function tag() { }; tag `string text ${expression} string text` // 함수 호출 Expression inte..
2023.01.05 -
Array.from(element.parentNode.children).indexOf(element) element.parentNode.children → element해당 요소를 포함하여 의 형제를 반환합니다. Array.fromchildren → 생성자 를 Array객체 로 캐스트합니다. indexOf → 이제 대상[Array]이 있으므로 indexOf를 신청할 수 있습니다.
ES6 - 자식노드 인덱스 가져오기Array.from(element.parentNode.children).indexOf(element) element.parentNode.children → element해당 요소를 포함하여 의 형제를 반환합니다. Array.fromchildren → 생성자 를 Array객체 로 캐스트합니다. indexOf → 이제 대상[Array]이 있으므로 indexOf를 신청할 수 있습니다.
2023.01.02