Life goes slowly...

Uncaught TypeError: Illegal invocation 에러 해결방법 자바스크립트(Javascript)의 콘솔(Console) 창에 Uncaught TypeError: Illegal invocation 에러가 나타나는 경우가 있습니다. 이는 자바스크립트(JAvascript)의 Ajax를 통하여 데이터를 넘겨줄 때 발생하는 Error입니다. 이는 datatype을 Json으로 설정하고 나서 Json 형태가 아닌 일반 배열로 datatype을 넘기려고 할 때 발생하는 Error입니다. Uncaught TypeError: Illegal invocation의 에러가 발생할 때에는 제일 먼저 datatype을 확인하여 보고 만약 datatype이 Json 형태가 아니라면 JSON.stringify(..

자바스크립트(Javascript) Button으로 파일 업로드 파일 업로드 시 대부분 input으로 type을 file로 처리하여 코드를 작성합니다. 하지만 이는 너무 단조로워 Button 형식으로 처리하게 되면 보기 좋은 웹 페이지를 생성할 수 있습니다.input type=file을 Button 형식으로 변경하는 방법을 알아보겠습니다. 제일 간단한 방법은 Button에 onclick 이벤트를 연결하는 방법입니다. Image 조금 더 자세한 방법은 input에 onchang() 함수를 연결하는 방법입니다. Image

자바스크립트(Javascript) CSS 파일 변경하기 웹페이지 생성 시 각각 QA서버와 운영서버마다 CSS 파일을 변경해야 할 때가 있습니다. 그럴 때 자바스크립트(Javascript)에서 동적으로 CSS 파일을 변경하는 방법이 있습니다. 방법으로는 link 태그에 ID 값을 할당한 뒤에 해당 ID에 CSS 파일을 변경하는 방법입니다. 타이틀 change1.css로 변경 change2.css로 변경

자바스크립트(Javascript) 배열 중복 제거하기 자바스크립트(Javascript)에서 배열 형식의 데이터를 가지고 있을 때 배열 데이터의 중복 값을 제거하여 표현하는 방법입니다. 배열 데이터의 중복값을 제거하는 방법의 3가지가 있습니다. 첫 번째로는 indexOf() 함수와 filter() 함수를 함께 사용하는 방법입니다. 자바스크립트(Javascript)의 indexOf() 함수는 배열 형식의 데이터중에 처음으로 나오는 index를 반환하는 함수이며, 자바스크립트(Javascript)의 filter() 함수는 조건에 맞는 배열의 모든 값을 반환하는 함수입니다. const dataArr = [6, 4, 2, 1, 2, 4, 3, 2]; const filterArr = dataArr.filter((e..

오라클(Oracle)의 버전 확인하기 오라클(Oracle)을 사용할 때 버전에 알맞은 쿼리를 사용하거나 환경을 확인하기 위해서 사용되는 쿼리문입니다. 추가적으로 WHERE 조건문을 사용하여 원하는 정보만 조회도 가능합니다. //오라클 버전 및 서버 운영체제, 버전 확인 SELECT * FROM SYS.PRODUCT_COMPONENT_VERSION; SELECT * FROM V$VERSION; cmd 창에서 확인이 가능합니다. //cmd창에서 오라클 서버버전 확인 c:> sqlplus SQL*Plus: Release 10.2.0.1.0 - Production on 일 5월 9 21:25:06 2021 Copyright (c) 1982, 2005, Oracle. All rights reserved.

자바스크립트(Javascript) 세계 Local 시간 구하기 자바스크립트(Javascript)로 외국 현재시간 즉 각 나라의 Local 시간을 구하는 방법을 알아보겠습니다. 먼저 각 나라의 GMT 타임존을 알아야 하는데 GMT란, Greenwich Mean Time의 약자로, 경도 0도의 위치한 영국 그리니치 전문대를 기준으로 하는 태양 시간을 말합니다. KST (한국 표준시) +09:00 EST (뉴욕 시간) -05:00 CET (파리 시간) +01:00 CST (중국 표준시) +08:00

SSL이란 무엇인가? 웹 사이트를 운영하게 되면 인증서를 서버에 적용해야 되며 그에 따른 인증서를 SSL이라고 합니다. SSL이란 Secure Socket Layer 으로 보안 소켓 계층을 말하며, 인터넷 상에서 데이터를 안전하게 전송하기 위한 인터넷 암호화 통신 프로토콜을 말합니다. SSL의 기본 개념은 인증서를 서명한 기관 및 사람을 신뢰하여 각 사이트의 인증서 또는 호스트 인증서를 신뢰하는 서명서입니다. SSL 프로토콜은 처음에 Netscape사에서 웹서버와 브라우저 사이의 보안을 위하여 만들었으며, SSL은 Certificate Authority라 불리는 서드파티로부터 서버와 클라이언트의 인증을 하는데 사용됩니다. SSL 인증서 적용 SSL 프로토콜 적용시 필요한 내용은 인증서 파일과 , Key ..

자바스크립트(Javascript) 부모 창 데이터 넘기기 웹페이지를 제작할때에 popup창을 여는 경우가 있는데 popup창을 자식 창이라 하고 popup창을 열게 하는 웹페이지를 부모 창이라고 합니다. 자바스크립트(Javascript)로 자식창의 Action으로 부모 창에 영향을 주거나 데이터를 넘길 때가 있습니다. 그럴 때 사용하는 opener() 함수입니다. //부모창에서 popup창 열기 window.open([URL], [타켓], [option]); //자식창에서 부모창 함수 호출 window.opener.[부모창 함수]; //자식창에서 부모창 ID값 가져오기 opener.document.getElementById([부모창 ID값]).value(); //자식창에서 부모창 ID에 value 설정하..

자바스크립트(Javascript) 복사, 붙여넣기 막기 자바스크립트(Javascript)로 복사(Ctrl+C) 및 붙여 넣기(Ctrl+V)를 막는 방법입니다. 블로그 포스팅을 복사해서 붙여 넣기를 하는 키를 막아보도록 하겠습니다. 그러한 방법으로는 KeyCode를 사용하여 쉽게 막을 수 있습니다. //Ctrl+C Keycode로 막기 function ctrlCKeycode(){ if(evet.ctrlKey && event.keycode === 67){ evebt.returnValue = false; } } //Ctrl+V Keycode로 막기 function ctrlCKeycode(){ if(evet.ctrlKey && event.keycode === 86){ evebt.returnValue = fals..

자바스크립트(Javascript) 객체(Object)에 프로퍼티 추가하기 자바스크립트(Javascript)에서 배열(Array)에 추가할 때에는 Push() 함수를 사용하여 추가를 할 수가 있었습니다. 객체(Object)에는 어떻게 추가를 하는지 알아보겠습니다. 일단은 프로퍼티를 추가할 때에는 Key 값이 있어야 하고 Key에 따른 Value 값이 있어야 합니다. 프로퍼티 추가할 때에 여러 방법이 있으니 하나씩 알아보도록 하겠습니다. //객체에 프로퍼티 추가방법 //1.객체 생성후 프로퍼티 추가하는 첫번째 방법 let TestData = new Object(); TestData.age = 32; TestData.name = "빨강소"; //2.객체 생성후 프로퍼티 추가하는 두번째 방법 let TestOb..

자바스크립트(Javascript)의 파일 확장자 체크 자바스크립트(Javascript)로 업로드하는 파일의 확장자를 체크하여 파일 업로드 시 일부의 파일 확장자를 제한이 가능합니다. 특히, 이미지 파일의 확장자를 체크하여 파일 업로드 시 확장자를 제한이 가능합니다. 방법으로는 업로드되는 파일명의 뒷자리에서부터 '.'을 찾아서 체크를 할 수 있습니다. 뒷자리에서부터 '.'을 찾을때에는 lastIndexOf() 함수를 사용하여 찾을 수 있습니다. //파일 확장자 체크하기

자바스크립트(Javascript)의 Image 사이즈 구하기 자바스크립트(Javascript)로 Image 사이즈를 확인하는 방법입니다. 제일 먼저 input 태그로 Image 파일을 첨부하고 Image 파일의 값의 사이즈를 알아보도록 하겠습니다. // Image 업로드후 이미지 크기 확인하기 참고로 clientWidth와 clientHeigt는 border와 스크롤바의 크기는 제외되는 값으로 실제 보이는 대상이 차지하는 공간의 값을 확인하게 됩니다.

stopPropagation() 함수는 제이쿼리(jquery)에서 preventDefault() 함수와는 다르게 이벤트 취소를 하는 함수로써 현재 이벤트 이후의 전파를 모두 취소하는 함수입니다. 쉽게 말하자면 부모 태그로의 이벤트 전파를 모두 취소하는 함수입니다. //stopPropagation() 함수 사용법 event.stopPropagation() 제이쿼리(jQuery)의 preventDefault() 함수 제이쿼리(jQuery)의 stopPropagation() 함수는 클릭 이벤트 외에 별도의 브라우저 행동을 제지하기 위하여 사용되는 함수입니다. TEST ===================================== //이벤트 전달을 중단하는 stopPropagation() 함수 $("#Te..

preventDefault()는 제이쿼리(jquery)에서 이벤트 위임을 통하여 다수의 요소(elemnet)에 공통으로 적용되는 이벤트 핸들러를 공통된 상위 요소에 단 한 번의 연결만으로 동작할 수 있도록 하는 함수입니다. 쉽게 말하자면 preventDefault() 함수는 취소 할수 있는 이벤트들을 취소하도록 하는 함수이지만 모든 이벤트 전파를 막지는 못하고 이벤트를 취소만 가능합니다.. 발생하는 이벤트들의 Default 액션이 발생하지 않는다는 의미입니다. 하지만 모든 이벤트가 취소가능한 이벤트는 아님을 명심해야 합니다. 이벤트의 취소 가능 여부는 event.cancelable를 사용하여 확인이 가능합니다. //preventDefault() 함수 사용법 event.preventDefault() 제이쿼..

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