카테고리나 분류를 선택할 때 자주 사용하는 화면이 Select 라는 항목입니다.

단일 Select의 경우가 아닌 1차를 선택해야 2차가 표시되는 작업을 웹사이트 제작에서 많이 사용합니다. 

Select 선택한 값 얻기

console.log( $('#셀렉트박스ID option:selected').text() ); // 선택된 selected 표시한 얻기
console.log( $('#셀렉트박스ID option:selected').val() ); //선택된 selected value 얻기

Select 추가하기

$('#셀렉트박스ID').append("<option value='2'>2번째 옵션</option>"); // 2번째 옵션추가
$(''#셀렉트박스ID').val("2").prop("selected","selected"); //2번째 옵션 선택
$('#셀렉트박스ID option:eq(n)').after("<option value='n+1'>n+1번째 값</option"); // n번째 다음에 추가
$('#셀렉트박스ID option:eq(n)').before("<option value='n+1'>n+1번째 값</option"); // n번째 이전에 추가

Select 요소 삭제하기

$('#셀렉트박스ID option:first').remove(); // 첫번째 option 삭제
$('#셀렉트박스ID option:last').remove(); // 마지막째 option 삭제
$('#셀렉트박스ID option:eq(n)').remove(); // n번째 option 삭제
$("#셀렉트박스ID").children('option:not(:first)').remove(); //첫번째 option 빼고 모두 삭제