Life goes slowly...

자바스크립트(Javascript)의 자식노드 접근방법 childNodes은 자바스크립트(Javascript)에서 자식 element나 노드에 접근하는 방법으로, 현재 element의 자식 노드가 포함된 노드 List를 반환합니다. 이때 반환되는 노드 List에는 element의 노드 뿐만 아니라 주석 노드와 같은 비요소 노드를 포함합니다. //childNodes 사용방법 element.childNodes 1. 철수 2. 동건 3. 토마스 4. 원빈 5. 인성 console.log(document.querySelector("ul").childNodes) [object NodeList] { 0: [object Text] { addEventListener: function addEventListener() {..

제이쿼리(jquery)에서 가장 많이 사용하고 자주 사용하고 있는 엘리먼트의 형제 엘리먼트를 찾아주는 함수입니다. siblings() 함수는 자신을 제외한 형제 엘리먼트를 찾는 함수입니다. 형제 엘리먼트의 class를 추가하거나 삭제할 때 많이 사용되는 함수입니다. //siblings() 함수 사용법 elements.siblings([filter]) 제이쿼리(jQuery)의 siblings() 함수 제이쿼리(jQuery)의 siblings() 함수는 지정한 선택자의 형제 요소를 모두 선택합니다. 1. 철수 2. 동건 3. 토마스 4. 원빈 5. 인성 ===================================== //id 가 test 요소를 제외하고 나머지 요소가져오기 $("li#test").sibl..

UTC(Coordinated Universal Time) 협정 세계시란 국제적인 표준시간의 기준으로 사용되는 시간을 말합니다. 1972년 1월 1일부터 시행되어 국제 표준시, 국제 사회가 사용하는 과학적인 시간의 표준을 말합니다. 기존에 사용되었던 평균 태양시 기준의 그리니치 표준시(GMT)를 대체하여 사용하기 시작된 표준시간입니다. UTC에서 0시, 기준점에 달하는 도시는 영국의 런던으로써 런던을 기준으로 +,-로 시간을 계산하며 대한민국은 런던을 기준으로 +9 시입니다. 자바스크립트(Javascript)로 UTC -> Local 변경 UTC형식의시간은 마지막에 Z가 붙는 것으로 알 수가 있으며 UTC 시간대가 아닐 경우에는 ±hh:mm, ±hhmm, ±hh을 붙이게 됩니다. 따라서 UTC 날짜를 현지..

자바스크립트(Javascript)의 객체 정렬하기 자바스크립트(Javascript)의 함수 중에는 객체(Object) 배열을 정렬할 수 있는 sort() 함수가 있습니다. sort() 함수는 배열의 요소를 적절한 위치에 지정한 뒤에 그 배열을 반환하는 함수입니다. sort() 함수는 내림차순으로 정렬을 하며 오름차순으로 정렬을 하기 위해서는 reverse() 함수를 사용하면 됩니다. //sort 함수로 정렬하기 let monthsData = ['March', 'Jan', 'Feb', 'Dec']; monthsData.sort(); console.log(monthsData); let countData = [1, 5, 8, 3, 13, 1000, 33]; countData.sort(); console.log..

자바스크립트(Javascript)의 엑셀 다운로드 하기 자바스크립트(Javascript)에서 HTML로 된 table 형태로 된 데이터를 엑셀로 다운로드를 받는 방법입니다. 프론트엔트 개발에 많이 사용될거라 생각되어 작성하여 봅니다. Java 형태로 된 개발은 많이 사용되었지만 API로 호출하여 가져온 데이터를 HTML 형태로 만들어져 있는 Table 데이터를 자바스크립트(Javascript)로 엑셀 다운로드 하는 방법입니다. Column 1 Column 2 Column 3 데이터1_1 데이터1_2 데이터2_1 데이터2_2 데이터3_1 데이터3_2 엑셀다운로드 버튼의 onclick 이벤트를 생성하여 제이쿼리(jQuery)로 클릭 이벤트 함수를 만들면됩니다. //엑셀 다운로드 함수 $('#buttonExc..

오라클(Oracle)의 REGEXP_SUBSTR() 함수 오라클(Oracle)의 REGEXP_SUBSTR() 함수는 Oracle 10g부터 나온 함수입니다. 오라클(Oracle)의 SUBSTR함수가 단순하게 인덱스를 지정하여 문자열을 잘라내는 함수였다면, 오라클(Oracle)의 REGEXP_SUBSTR() 함수는 정규식을 통하여 다양한 방법과 다양한 패턴을 사용하여 문자열을 잘라내는 함수입니다. //REGEXP_SUBSTR()함수 사용방법 REGEXP_SUBSTR([컬럼],[정규표현식], [시작 인덱스], [찾는 순번]) 예를 들면 이메일주소의 아이디, 도메인을 찾아서 표기할 때 많이 사용되며, 정규식 표현에 사용되는 데이터 조회 시 많이 사용됩니다. //이메일 ID 찾는 정규식 REGEXP_SUBSTR..

Cookie(쿠키)란 클라이언트 로컬에 저장되는 키와 값의 데이터입니다. 사용자 인증이 유효한 시간을 명시 가능하며, 유효시간이 정해지면 브라우저가 종료되더라도 인증은 유지됩니다. //jquery 라이브러리에 있는 cookie 플러그인을 사용하면 됩니다. 제이쿼리(jQuery) Cookie 생성하기 제이쿼리(jQuery)로 Cookie를 생성할때 옵션을 정할수 있습니다. // Cookie 생성 - 브라우저를 닫을때 cookie 삭제 $.cookie('test', '1111'); // 7일 뒤에 만료 Cookie 생성 $.cookie('test', '1111', { expires: 7 }); // 전체 사이트에 대해 7일 뒤에 만료 Cookie 생성 $.cookie('test', '1111', { expi..

Radio Button의 제이쿼리(jQuery) 이벤트를 통하여 제어가 가능합니다. 1 2 3 4 제이쿼리(jQuery)의 radio button 체크된 value 값 확인 제이쿼리(jQuery)를 활용하여 라디오 버튼의 체크된 value 값을 확인할 수 있습니다. // radio button 체크된 value 값 출력 console.log($('input[name="radioType"]:checked').val()); 제이쿼리(jQuery)의 value 값으로 radio button 체크하기 제이쿼리(jQuery)를 활용하여 value 값을 통하여 라디오 버튼의 체크를할 수 있습니다. // value 값으로 radio button 체크하기 // value 값 2 radio button 체크하기 $('i..

자바스크립트(Javascript)에서 버튼(Button) 영역에 disabled 속성을 추가 및 삭제하여 버튼을 클릭하거나 클릭을 하지 못하도록 활용을 해보도록 하겠습니다. 자바스크립트의 disabled 속성 활용하기 Jquery로 disabled 속성 활용하기 자바스크립트(Javascript)뿐만 아니라 제이쿼리(JQuery)에서도 활용이 가능합니다. 제이쿼리(JQuery)의 attr 함수를 사용하여 disabled 속성을 활용할 수 있습니다.

element 내부에 가지고 있는 innerText와 innerHTML 차이점은 무엇일까요? innerText은 element 내부에 있는 text 값들을 말하며 innerHTML는 element 내부에있는HTML이나 XML 모두를 말합니다. 안녕하세요 Hello World!! 자바스크립트(Javascript) 값 가져오기 innerText는 설정한 엘리먼트의 보이는 텍스트 값을 가져옵니다. ===================== 안녕하세요 Hello World!! innerHTML는 엘리먼트의 HTML 구조 모두를 가져옵니다. ===================== 안녕하세요 Hello World!! 자바스크립트(Javascript) 값 설정하기

자바스크립트(Javascript) E-Mail 유효성 검사 자바스크립트(Javascript)에서 입력값을 정규식 표현을 통하여 유효성 검사를 할 수 있습니다. 특히 누구나 하나씩은 가지고 있는 이메일의 유효성 검사는 자주 사용하는 방식입니다. 정규표현식을 처리하는 함수를 하나 생성한뒤에 입력하는 E-Mail 주소를 리턴하는 코드를 작성하도록 하겠습니다.

selectbox의 제이쿼리(jQuery) 이벤트를 통하여 제어가 가능합니다. 나라선택 Korea United States Japan China Canada Hong Kong 제이쿼리(jQuery)의 selectbox change 이벤트 제이쿼리(jQuery)를 활용하여 selectbox change 이벤트를 사용할수있습니다. // selectbox의 change 이벤트 $("#country").change(function() { console.log(this.value); }); // selectbox의 on 이벤트 $(document).on('change',"#country", function() { console.log($(this).val()); });

List Check 번호 이름 Check 1 철수 Check 2 영수 Check 3 토마스 Check 4 순이 Check 5 창모 jQuery의 checkbox 여부 확인 jQuery를 활용하여 checkbox 리스트의 전체 갯수와 checked 된 갯수를 확인 가능합니다. // checkbox의 전체 갯수 $("input:checkbox[name=chkList]").length // checkbox의 선택된 갯수 $("input:checkbox[name=chkList]:checked").length // checkbox의 전체 체크 $("input[name=chkList]:checkbox").prop("checked", true); jQuery의 each문을 통하여 checked된 value 값 가져오..

리눅스 파일 인코딩 형식 확인 file -bi는 리눅스(Linux)에서 특정 파일의 인코딩 형식을 확인이 가능한 명령어입니다. //인코딩 형식 확인 $ file -bi [파일명] $ file -bi abc.py --------------------------------------------- text/x-python; charset=utf-8 리눅스 파일 인코딩 형식 변환 iconv는 리눅스(LInux)에서 특정 파일의 인코딩 형식을 변환하는 명령어입니다. //인코딩 형식 변환 $ iconv -c -f [현재인코딩방식] -t [변환할 인코딩방식] [변환할파일] [변화된파일] $ iconv -c -f utf-8 -t euc-kr abc.py new_abc.py $ file -bi new_abc.py ---..

tar 파일 압축해제하기 //tar 파일 압축 해제하기 $ tar -xvf [압축파일명.tar] tar.gz 파일 압축해제하기 //tar.gz 파일 압축해제하기 $ tar -zxvf [압축파일명.tar.gz] zip 파일 압축해제하기 //zip 파일 압축 해제하기 $ unzip [압축파일명.zip] //특정 폴더에 zip 파일 압축해제하기 $ unzip [압축파일명.zip] -d [압축하기위한 폴더] tar 명령어에서 자주쓰는 옵션 -c : 파일을 tar로 묶음 -p : 파일 권한을 저장 -v : 묶거나 파일을 풀때 과정을 화면에 출력 -f : 파일이름을 지정 -C : 경로를 지정 -x : tar 압축을 풀때 사용함 -z : gzip으로 압축하거나 해제