안녕하세요 코봉이입니다. 오늘은 appendChild 함수를 이용하여 HTML Select 태그에 Option을 추가하는 방법에 대해 기록하겠습니다. 오늘의 목표에 대해 간략히 설명드리겠습니다. 기존의 Select 태그에 "이름"(disable, selected)과 "코봉이" 라는 Option이 이미 있고 "추가" 버튼을 누르면, 클릭 이벤트 리스너를 통해 (addEventListener → click) 3명에 해당하는 Option이 추가되는 컨셉입니다. 먼저 HTML 파일은 아래와 같이 준비해주세요. 이름 코봉이 추가 JavaScript source 파일은 위에서 확인 가능하듯이 "addOptionScript.js" 파일을 사용하겠습니다. 파일 경로에 대해서는 설명 안드려도 알아서 하실 수 있으시죠? ..

안녕하세요 코봉이입니다. 오늘은 JavaScript를 활용하여 배열(Array)의 요소들을 중복제거 Set 하는 방법을 알려드립니다. JavaScript에 기본으로 내장되어 있는 내장함수를 이용하는 방법인데요. 아래 예시를 참고하시기 바랍니다. let arr = ['A', 'B', 'C', 'D', 'A', 'E', 'C']; console.log(arr); // [ ‘A’, ‘B’, ‘C’, ‘D’, ‘A’, ‘E’, ‘C’ ] // Set 내장함수 활용하여 중복 제거하기 console.log(new Set(arr)); // Set { ‘A’, ‘B’, ‘C’, ‘D’, ‘E’ } // Set 이용하여 배열 만들기 let setArr; setArr = [... new Set(arr)]; console...

안녕하세요. 코봉이입니다. 오늘은 JavaScript 를 이용하여 HTML에 JSON File을 삽입하는 방법을 알려드리겠습니다. 그 비결은 바로 Fetch API에 있습니다! 지금부터 예시를 들어 한 번 보여드리겠습니다. // JSON 파일 생성 → /files/fileData.json {"name":"Kobong", "age":20, "city":"Dague"} files라는 폴더를 만들어 주고, fileData.json 파일을 생성 후 저장해주세요. index.html, script.js 파일 두 가지를 준비해 주셔야 하는데요. 우선 index.html 부터 아래와 같이 입력하세요! 위와 같이 index.html에 script.js 파일을 연결시켜 줍니다. .js 파일에서 Fetch Web API를..

HTML 삽입 미리보기할 수 없는 소스 안녕하세요 코봉이입니다. javascript 를 사용하여 alert 창을 띄우면 기본 style이 아래와 같이 심심한 모양이죠. 하지만, SweetAlert2.js를 연결하여 이용하면 더욱 더 예쁜 alert 창을 만날 수 있습니다. 아래 코드를 이용하면 위 캡쳐 사진처럼 Style이 더 예쁜 alert 창을 만나볼 수 있습니다. 추가 사용 방법에 대한 설명이나 예제는 아래 SweetAlert2 공식 홈페이지를 참고하시기 바랍니다. https://sweetalert2.github.io/#examples

dropupAuto = False $(.selectpicker).selectpicker({refresh:true, dropupAuto: false});

$('#아이디명') $('[id^=아이디명]')