profile
꾸준히 새로운 것을 알아가는 것을 좋아합니다.

[JavaScript] remove() 와 removeChild() 의 차이점

프로젝트를 진행하다가 remove와 removeChild 의 기능은 비슷하나, 어떤 차이점이 있을지에 대한 의문이 들어 조사한 바를 바탕으로 글을 작성해본다.The Element.remove() method removes the element from the DOM.:

2022년 6월 14일
·
0개의 댓글
·

Horizontal Scrolling of web page

수평 스크롤 효과를 구현하고 있으며, 사용자가 일반적으로 수직으로 스크롤을 해도 페이지가 수평으로 스크롤 된다.주의해야 할 사항은, 사용자가 어떤 화면을 사용할지 알 수 없기 때문에 픽셀을 사용한 고정적인 사이즈 대신에 vw vh 라는 상대 단위를 사용한다.!codep

2022년 4월 3일
·
0개의 댓글
·

기초부터 완성까지 프런트엔드 4장, 타입 변환과 함수

함수는 객체의 특별한 형태이며 문(statement)으로 구성된 몸체를 가진 하나의 실행 단위이다.자바스크립트의 함수는 일급 함수(first-class function) 로서 다른 함수의 매개변수나 반환 값으로도 사용할 수 있다.다른 함수의 인자로 넘어가는 함수를 콜백

2022년 3월 27일
·
0개의 댓글
·

기초부터 완성까지 프런트엔드, 3장 타입 변환과 구문

정적 언어와는 다르게 자바스크립트는 느슨한 언어(loose typing)을 가진 언어이기 때문에 데이터 타입을 따로 명시하지 않고 변수를 선언할 수 있다.느슨한 타입이라고 타입이 존재하는 것은 아니다. 변수 선언 시, 타입을 명시하지 않는 것일 뿐, 내부적으로는 데이

2022년 3월 25일
·
0개의 댓글
·
post-thumbnail

[JavaScript] 마우스 wheel 이벤트를 조작하여, Zoom 기능 구현

마우스 스크롤 휠 이벤트를 이용하여, DOM 이벤트 조작 & CSS 변환으로 작업 영역을 확대 / 축소 할 수 있는 기능을 만들어 보자.!codepenchriscoyier/embed/oNzLRza?default-tab=html%2Cresult

2022년 3월 21일
·
0개의 댓글
·
post-thumbnail

스크롤 상태 표시 바 (@support)

article을 보다보면 스크롤을 내리는 일이 많아서 스크롤에 맞게 header에 진행 상황을 표시해주는 것을 종종 보곤 했는데, 평소에 그 기능을 어떻게 구현할 수 있을까 라는 의문점을 가지고 있었다. 외국의 문서들을 살펴보다가 좋은 글을 발견하여, 추후에 내가 그

2022년 3월 20일
·
0개의 댓글
·

[JavaScript] 이벤트리스너 제거 시, 유의사항

일반적으로는, 위의 코드 방식대로 이벤트 리스너를 제거 할 것이다.그러나. 위의 방법으로 했을 때, 정상적으로 이벤트가 제거되지 않는다.why ? click 했을 때, addEventListener의 testFunc(1)와 removeEventListener의 tes

2022년 3월 13일
·
0개의 댓글
·

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

이벤트 위임은 비슷한 방식으로 여러 요소를 다뤄야 할 때 사용된다. 이벤트 위임을 사용하면 요소마다 핸들러를 할당하지 않고, 요소의 공통 조상에 이벤트 핸들러를 단 하나만 할당해도 여러 요소를 한꺼번에 다룰 수 있다.위의 코드는 좋지 않은 코드이다. 모든 li의 요소들

2022년 2월 17일
·
0개의 댓글
·

[JavaScript] 캡쳐링 & 버블링

캡쳐링 시기와 버블링 시기는 브라우저에서 이벤트를 처리하는 순서와 밀접하게 관련이 있다. 일반적으로 이벤트리스너(콜백함수)를 등록하게 되면 기본적으로 버블링 단계에서 등록된 콜백함수가 호출이된다.(대부분의 캡처링 단계에서 무언가를 처리해줘야 했던 적은 없다. 기본적으로

2022년 2월 17일
·
0개의 댓글
·