본문 바로가기

자바스크립트4

$.each each는 자바스크립트에서 반복문을 편하게 사용하기 위해 사용한다. 1. 여러개의 요소를 선택했을 때 사용하는 방법 $("선택한요소").each(function(i, v){ // i는 순서, v는 i번째의 값을 나타낸다 } 2. 배열 또는 List를 처리하기 위한 방법 $.each(배열또는 List, function(i, v){ // 위와 마찬가지로 // i는 인덱스 v는 해당 인덱스의 값 } 2023. 5. 23.
Chart.js 사용하기 통계를 쉽게 chart로 확인할 수 있는 chart.js를 사용하는 방법을 알아보자 전체 소스는 맨 밑에!! 1. cdn 추가하기 jquery는 버전에 맞게 맞춰 사용하면 된다. 2. body에 div태그 넣기 3. 차트 생성하기 4. 버튼 만들기 비동기 방식으로 차트의 값을 바꾸기 위해 버튼 3개를 만들었다 5. 버튼을 클릭하면 함수를 실행하여 비동기 발생시키기 'test2.csv'파일은 단순히 dummy데이터로 파일 안에는 20,30,10,5,22,30 모양의 데이터가 들어 있다. 6. 추가로 style css! 버튼 css를 추가해 보았다 7. 전체코드 2023. 5. 1.
ajax를 만들어서 사용해보자 const xhr = new XMLHttpRequest(); xhr.open('method', 'url', true); xhr.onreadystatechange = () => { if (xhr.readyState == 4 && xhr.status == 200) { console.log(xhr.responseText); // 응답 받은 결과 } } 생각보다 간단해서 놀랐다. 가끔은 만들어 사용하는 것도 재미있을 것 같다. 아래는 일반적으로 사용하는 ajax $.ajax({ method: 'get', url: 'url', dataType: 'json', sucess: function (res) { console.log('응답받은 결과', res); }, }); 2023. 4. 28.
sweetalert 쉽게 사용하기 alert창보다 예쁜걸 쓰고싶다면 sweetalert을 사용해보자 http://sweetalert.js.org에서 CDN을 복사해 사용하자 2023. 4. 28.