[jQuery] 이전, 다음 요소 선택하기

jQuery 선택자 요소에서 이전 요소 또는 다음 요소를 선택하는 방법을 알아보자

1. prev()

• 이전 요소를 선택하도록 반환

  prevAll() : 이전 모든 요소 선택

<script>
removeFile: function(btnRemove){
		
	// 이전 요소 타입 찾기
	var beforeTag = btnRemove.prev().prop('tagName');
    
    // 이전 요소 타입이 버튼이라면 이전 모든 요소 중에 type="file"인 것 찾아서 빈값으로 지정
	if(beforeTag === 'BUTTON'){
		var firstFile = btnRemove.prevAll('input[type="file"]');
		firstFile.val('');
		return;
	}
		
	// 그 외의 경우 data-attach-file로 지정된 <div> 태그 찾아 해당 파일 영역 삭제
	var otherFile = btnRemove.closest('[data-attach-file]');
	otherFile.remove();
}
</script>

2. next()

• 다음 요소를 선택하도록 반환

  nextAll() : 다음 모든 요소 선택

<script>
removeFile2: function(btnRemove){
		
	// 다음 요소 타입 찾기
	var nextTag = btnRemove.next().prop('tagName');
		
	// 다음 요소 타입이 버튼이라면 다음 모든 요소 중에 type="file"인 것 찾아서 빈값으로 지정
	if(nextTag === 'BUTTON'){
		var firstFile = btnRemove.nextAll('input[type="file"]');
		firstFile.val('');
		return;
	}
		
	// 그 외의 경우 data-attach-file로 지정된 <div> 태그 찾아 해당 파일 영역 삭제
	var otherFile = btnRemove.closest('[data-attach-file]');
	otherFile.remove();
}
</script>