본문 바로가기

JavaScript & jQuery

append(), prepend()의 차이점

반응형

오늘은 비슷하지만 매우 다른 용도와 알고나면 엄청 편한 두 함수에 대해 알아보겠다. 

 

우선 간단하게 말하면

 

1.  append() 는 그냥 선택한 블록에 제일 마지막으로 넣어주는 것 (기존의 내용이 있으면 그 뒤에)

2. prepend()그냥 선택한 블록에 제일 첫번째로 넣어주는 것 (기존의 내용이 있어도 그 앞에)

 

 

 

See the Pen ExKaJaq by Sang Hoon Jeong (@DevilFront) on CodePen.

 

위에서 각각 버튼을 눌러보다 보면 두 함수의 차이점을 알 수 있을 것이다.

 

매우 유용한 것이 가령 본인도 프로젝트 진행 간 게시판 부분에서 특정 캠핑장에 대한 정보를 꼽아주는 부분이 있었는데 사용자 입장에서 생각해보면 사용자는 정해져있는 틀이 없다 후기를 작성하다가 중간에 파일을 첨부하거나 혹은 제일 나중에 할 수도 있기 때문에 보여질 때 가장 위에 있어야 이쁘고 문맥상 흐름에 맞게 하려면 append()를 이용해주면 되겠다. 

반응형