DOM 문서객체 모델(The Document Object Mode, DOM)은 HTML, XML 문서의 프로그래밍 interface 웹페이지는 어떻게 만들어질까? 웹브라우저가 원본 HTML 문서를 읽어들인 후, 스타일을 입히고 대화형 페이지로 만들어 뷰 포트에 표시하기까지의 과정을 'Critidal Rendering Path'라고 함. 이 과정을 여러 단계로 나누어져 있지만, 대략 두 단계로 나눌수 있는데, 첫번째 단계에서 브라우저는 읽어들인 문서를 파싱하여 최종적으로 어떤 내용을 페이지에 렌더링할지 결정하고 두 번째 단계에서 브라우저는 해당 렌더링을 수행. 첫번째 과정을 거치면 '렌더트리'가 생성되는데, 렌더 트리는 웹 페이지에 표시될 HTML요소들과 이와 관련된 스타일 요소들로 구성됨. 브라우저는 렌..

Json Key 가져오기 : Object.keys()사용 let jsonObj = {'이름':'에이미','나이':5}; Object.keys(jsonObj); console.log(Object.keys(jsonObj)); //(2) ['이름', '나이'] Json Key, Value 가져오기 * 원래 Key는 String을 사용하지만 예시를 위해 임의로 적용해봄 var jsonStr = '[{"1":"9"},{"3":"3"},{"5":"3"},{"6":"7"}]';//Json형식의 String변수 var jsonArr = JSON.parse(jsonStr); //Json형식의 String값 -> Json객체로 변환 //jsonArr은 jsonObject가 4개 들어있는 배열 //console.log(js..

자바스크립트 빈값체크 ( 자바스크립트의 빈 값들인 undefined, null, NaN, '' 은 false를 return ) let unefinedVal = undefined; let nullVal = null; let binVal = ''; if(!unefinedVal){ console.log('이 값은 undefined입니다.'); } else{ console.log('이 값은 undefined가 아닙니다.'); } if(!nullVal){ console.log('이 값은 null입니다.'); } else{ console.log('이 값은 null이 아닙니다.'); } if(!binVal){ console.log('이 값은 ''입니다.'); } else{ console.log('이 값은 ''이 아닙..

onload [ JAVASCRIPT] window.onload = function(){ //실행될 코드 } 문서의 모든 컨텐츠(images, script, css, etc)가 로드된 후 발생하는 이벤트(load이벤트) 문서에 포함된 모든 컨텐스가 로드된 후에 실행되기에 불필요한 로딩시간이 추가될 수 있음 동일한 문서에 오직 'onload'는 하나만 존재해야 함 (중복될 경우, 마지만 선언만이 실행됨) 요소의 속성(attribute)으로 지정될 수 있음. 위와같이 요소의 속성으로 onload가 사용된 경우에는 'window.onload'는 무시됨 window객체뿐만 아니라 원하는 객체(object)가 로드되었을 때 실행될 코드를 설정할 수도 있음 document.getElementById("myFrame"..

1. for loop 가장 일반적인 for문 var arr = []; for(var i=0; i

서버호출 없이 JS만으로 엑셀다운로드 구현 //엑셀다운로드시 호출함수 function fnExcelReport(id, title) { var tab_text = ''; tab_text = tab_text + ''; tab_text = tab_text + ""; //엑셀다운로드시 저장될 테이블 지정하여 복사 var exportTable = $('#resultTable').clone(); //복사된 테이블에서 input 태그 제거 exportTable.find('input').each(function (index, elem) { $(elem).remove(); }); tab_text = tab_text + exportTable.html(); tab_text = tab_text + ''; var data_ty..