본문 바로가기
블로그 이미지

방문해 주셔서 감사합니다! 항상 행복하세요!

  
   - 문의사항은 메일 또는 댓글로 언제든 연락주세요.
   - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다.
   - 메일주소 : lts06069@naver.com


Javascript72

Javascript를 활용하여 데이터(배열)를 테이블로, 테이블 태그를 엑셀로(Javascript make excel file) sheetjs를 활용하면 간단하게 배열같은 데이터를 테이블 테그로 만들수 있다. https://sheetjs.com/ 해당 라이브러리를 사용하면 XLSX라는 객체를 통해서 다양한 기능을 사용 할 수 있다. read로 시작하는 함수는 데이터를 읽을 때 사용되며, write로 시작하는 함수는 데이터를 쓸 때 사용된다. 정말 직관적인 sheet_to_html 함수는 HTML에 데이터와 옵션을 함께 추가하여 웹에서 표를 그릴 때 사용된다. 아무튼!! 요 사이트에서 해당 라이브러리를 받은뒤에 배열값을 sheet_to_html 함수 사용을 통해서 멋지게 데이터를 그려준다. 위 소스코드를 실행하여보자. 코드 내용도 별로 어렵지가 않다. 여기에 XLSX 객체가 가지고 있는 writeFile 이라는 함수를 사용하면 데이.. 2020. 2. 27.
Javascript 화면 캡쳐, Javascript screen shot, Javascript screen capture [html2canvas] 브라우저에서 화면의 모습을 캡쳐하려면 html2canvas라는 오픈소스 라이브러리를 사용하면 구현하기 매우 간단합니다. https://html2canvas.hertzen.com/ 먼저 조금 철(?)지난 소스코드 사용방법 입니다. function click(){ html2canvas( document.querySelector('#대상') , { onrendered: function(canvas) { saveAs(canvas.toDataURL(), '이름.png'); } }); } function saveAs(uri, filename) { var link = document.createElement('a'); if (typeof link.download === 'string') { link.href = ur.. 2020. 1. 22.
Javascript json array loop, for (자바스크립트 json 배열 반복문) Object for Object loop * 일반 배열에서의 반복문 1. for in var array = [ {text:'abcd',number:1234}, {text:'efg',number:5678} ]; for(idx in array){ console.log(array[idx]); }; 2. 단순한 for var array = [ {text:'abcd',number:1234}, {text:'efg',number:5678} ]; for(i=0;i < array.length;i++){ console.log(array[i]); }; 3. forEach var array = [ {text:'abcd',number:1234}, {text:'efg',number:5678} ]; array.forEach(function(data, idx){ conso.. 2020. 1. 21.
Javascript 전개 연산자(... 문법, dot dot dot, Spread operator tricks) 자바스크립트에서 간혹 점 3개로 만들어진 문법을 볼 때가 있다 ->... 가령 요런코드가 있다고 하여보자. function printer(...arg){ console.log(arg); } printer(1,2,3,4,5); 해당 코드를 실행하면 아래 사진처럼 배열이 출력이 된다. 그러면 숫자 1을 넣어보고 아무런 값도 넣지않아보자. 마치 자바에서의 가변인자처럼 사용이 가능하다! 또한 불변데이터 패턴(Immutable data pattern)에서도 사용된다. 아래코드를 보면 쉽게 이해할 수 있다. var a = [3,4,5]; var b = a; a.push( 6 ); //a 배열에 6을 넣는다. console.log(a); //3,4,5,6이 출력된다. console.log(b); //3,4,5,6이 .. 2020. 1. 10.
(기본/기초) Javascript 배열 정렬, Javascript sort array 자바스크립트에서 배열의 정렬은 sort 라는 함수를 통해서 할 수 있다. sort라는 함수는 일반 함수처럼 사용 할 수 있으며, 단순한 기능 뿐만 아니라 익명함수를 넣어주면 사용자가 지정한 옵션에 따라 데이터를 정렬 할 수 있다. 1. 단순 1차원 배열 정렬 var month = ['March', 'Jan', 'Feb', 'Dec']; month.sort(); console.log(month); //순서 : Dec, Feb, Jan, March --> 알파벳 순서로 정렬 var array = [1, 30, 4, 21, 1000]; array.sort(); console.log(array); //순서 : 1, 1000, 21, 30, 4 --> 앞자리가 1부터 정렬됨. 크기순으로 되지 않음. var arr.. 2019. 12. 12.
(기본/기초) Jquery checkbox, jquery 체크박스, 제이쿼리 체크박스 1. 선택하기, 선택 해제하기 //attribute로 선택, 선택해제 $("대상").attr("checked", true); /* 선택 */ $("대상").attr("checked", false); /* 해제 */ //property로 선택, 선택해제 --> attr로 안되는 경우 $("대상").prop("checked", true); /* 선택 */ $("대상").prop("checked", false); /* 해제 */ 2. 체크가 되었는지 여부 //대상이 1개인 경우 $("대상").is(":checked"); //true 또는 false /* 대상이 여러개인 경우(멀티 체크같은 상황) 통상적으로 대상이 여러개인 경우는 클래스를 동일하게 주어 반복문으로 처리한다. */ $('.클래스').each(fu.. 2019. 12. 6.