목록frontend/javascript (29)
DEVLOG
테이블을 엑셀파일로 다운로드하기 javascript excel download 서버를 통하지 않고 js만으로 html의 테이블을 엑셀파일로 다운로드할 수 있는 방법은 다양하다. 직접 만드는 방법도 있고 라이브러리를 사용하는 방법도 있다. 처음에는 코드를 다 이해하고 직접 만들어보려고 했으나....ㅎㅎㅎㅎ 너무 어리석은 일~~ 멋쟁이들이 만들어놓은 라이브러리를 사용하면 아주~ 간단하게 해결할 수 있다! 1. tableToExcel 처음 사용했던 tableToExcel은 비교적 코드도 너무 간단하고 따로 추가해야하는 라이브러리도 없다! 결론부터 얘기하자면... 이거 사용하면 안됨 ㅎㅎㅎㅎ function tableToExcel(id, title) { var data_type = 'data:applicatio..
jQuery의 .append()를 아시나요..? 제가 참 좋아하는데요 ㅠ,ㅠ jQuery가 점점 줄어들고 순수자바스크립트의 중요성이 강해지면서 자바스크립트를 이용하는 방법을 알아볼까나요! 그 전에... append는 요소를 추가하는건데 왜 텍스트변경하는걸 알아보는거지?라고 생각할 수도 있는데 append()는 JS에서 '태그생성+내부텍스트변경+부모요소 밑으로 태그추가' 단계를 한번에 수행할 수 있도록 만들어준 jQuery문법이다. 그렇기 때문에 이를 순수자바스크립트로 구현하려면 이 세단계를 다 알아야한다는 뜻! var a = document.createElement("div"); //1. 태그 생성 /****2. 텍스트추가****/ document.querySelector("부모요소").appendChi..
📖 목차 스크립트를 위쪽에서 불러오면 요소를 찾지 못하는 오류를, 아래쪽에서 불러오면 느린 로딩속도 등의 이유로 우리는 스크립트 내에서 페이지로드 후 불러오는 함수를 사용하곤 한다. 대표적으로 js구문의 window.onload와 jQuery구문의 document.ready를 많이 사용할텐데 이 둘에 대해서 알아보고 이 외에 또 어떤것들을 사용할 수 있는지 알아보자! window.onload() 대표적인 속성인 window.onload는 HTML의 모든 태그를 불러온 후 코드내에 onload가 있을 경우 읽어낸다. 또한 js, css까지 모~~두 읽은 후에 실행이 되기 때문에 매우매우매우 느릴 수 있다는 단점이 있다. 또한 onload를 사용하면 가장 마지막에 실행된 onload함수만 실행하게 되는데 물..
JS의 다양한 메소드를 만나보자 (2편) Array. forEach find findIndex includes indexOf sort join String. replace substring split 배열관련 ● forEach : 주어진 함수를 배열 요소 각각에 대해 실행한다. 내 생각에는 밑에서 다루게 될 모든 메소드의 베이스가 되는 메소드인 것 같다. 배열.forEach(function(현재값[, index]){}); products.forEach(function(product,i){ console.log(product.id); } ● find : 배열 안을 돌면서 주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환한다. : 만족하는 요소가 없다면 undefined 반환 배열.find(functi..