일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- react
- GIT
- 리눅스
- 주식
- 리액트
- stockx.com
- dunk high
- 덩크 하이
- 발매예정
- jQuery
- sacai
- 코로나19
- draw
- 나이키
- JavaScript
- 주식공부
- 자바스크립트
- 드로우
- 파이썬
- Linux
- 덩크로우
- dunklow
- Python
- oracle
- Nike
- Dunk Low
- 제이쿼리
- 덩크 로우
- 오라클
- Github
- Today
- Total
목록JavaScript (86)
Life goes slowly...
자바스크립트(Javascript)의 addEventListener() 함수 자바스크립트(Javascript)의 addEventListener() 함수는 지정한 이벤트가 대상에 전달될 때마다 호출해야 할 함수를 설정할 때에 사용됩니다. 대부분의 대상은 Element나 Document 이겠지만 이벤트를 지원하는 모든 객체를 대상으로 지정이 가능합니다. addEventListener() 함수는 이벤트 지정의 주어진 유형에 따라서함수나 객체를 이벤트 처리기 목록에 추가하여 이벤트가 이루어지게 됩니다. addEventListener() 함수는 이벤트를 등록하는데 가장 권장하는 방식이며 여러 개의 이벤트 핸들러를 등록하여 사용이 가능합니다. //문자열 addEventListener() 함수 사용방법 target.a..
자바스크립트(Javascript)의 endsWith() 함수 자바스크립트(Javascript)의 endsWith() 함수는 확인하고자 하는 문자열에서 특정 문자열로 끝나는지 확인하는 함수입니다. 확인하고자 하는 특정 문자열이 있는 경우에는 True을 반환하게 되며, 그렇지 않은 경우에는 False을 반환하게 되는 함수입니다. 검색해야 할 문자열은 필수 요소이며, 문자열은 대소문자를 구분합니다. 문자열의 길이도 옵션에 포함되며, 문자열 길이를 넣지 않는 경우에는 전체 문자열을 대상으로 검색하게 됩니다. //문자열 endsWith() 함수 사용방법 문자열.endsWith( [검색하고자 하는문자], length ) //length - 문자열중 어디까지 검색할지 정하며, 만약 값을 설정하지 않으면 전체를 대상으..
자바스크립트(Javascript)의 startsWith() 함수 자바스크립트(Javascript)의 startsWith() 함수는 확인하고자 하는 문자열에서 특정 문자열로 시작하는지 확인하는 함수입니다. 확인하고자 하는 특정 문자열이 있는 경우에는 True을 반환하게 되며, 그렇지 않은 경우에는 False을 반환하게 되는 함수입니다. 검색해야 할 문자열은 필수 요소이며, 문자열은 대소문자를 구분합니다. 문자열의 길이도 옵션에 포함되며, 문자열 길이를 넣지 않는 경우에는 전체 문자열을 대상으로 검색하게 됩니다. //문자열 startsWith() 함수 사용방법 문자열.startsWith( [검색하고자 하는문자], length ) //length - 문자열중 어디까지 검색할지 정하며, 만약 값을 설정하지 않으..
자바스크립트(Javascript)의 charCodeAt() 함수 자바스크립트(Javascript)의 charCodeAt() 함수는 문자의 index에 해당하는 유니코드(Unicode) 값을 반환하는 함수입니다. 자바스크립트(Javascript)의 문자열 내의 문자는 왼쪽에서 오른쪽으로 인덱스가 매겨집니다. 유니코드(Unicode)는 시스템의 문자를 표현하기 위한 표준언어입니다. 자바스크립트(Javascript)의 charAt() 함수와 비슷한 형태이기는 하지만 charAt() 함수는 index에 해당하는 문자를 반환하며 charCodeAt() 함수는 index에 해당하는 유니코드(Unicode) 값을 반환하는 차이가 있습니다. //charCodeAt() 함수 사용방법 문자열.charCodeAt( [ind..
자바스크립트(Javascript)의 charAt() 함수 자바스크립트(Javascript)의 charAt() 함수는 문자열에서 지정된 위치에 존재하는 문자를 찾아서 반환하는 함수입니다. 자바스크립트(Javascript)의 문자열 내의 문자는 왼쪽에서 오른쪽으로 인덱스가 매겨집니다. 인덱스의 순번은 0부터 시작되고 마지막 인덱스 순번은 -1으로 매겨지게 됩니다. 인덱스가 문자열의 길이를 벗어나게 되면 빈 문자열을 반환합니다. charAt() 함수는 인덱스(index)로 주어진 값에 해당하는 문자를 반환합니다. //charAt() 함수 사용방법 문자열.charAt( [index] ) let test1 = "Hello World"; console.log(test1.charAt(0)); console.log(t..
Uncaught TypeError: 'undefined' is not a function 오류 원인 웹 개발 시 Chrome의 console 창에서 Uncaught TypeError: 'undefined' is not a function 에러 메시지가 나타나는 경우가 발생합니다. 이러한 에러 메시지가 발생하는 원인으로는 선언한 함수(function)를 찾을 수 없을 경우이거나 선언한 함수명이 tag ID, name등과 동일한 경우에 함수 내에서 오류가 발생하는 코드가 있다면 발생하는 에러 메시지입니다. 그 이외에도 제이쿼리(jQuery)의 라이브러리가 설치되지 않거나 중복되어 설치되어 있는 경우에도 이러한 에러메시지가 발생합니다. Uncaught TypeError: 'undefined' is not a ..
Cannot read property 'push' of undefined 오류 원인 자바스크립트(Javascript)의 콘솔(Console) 창에 Cannot read property 'push' of undefined 에러가 나타나는 경우가 있습니다. 이는 자바스크립트(Javascript)에서 배열에 요소를 추가하려고 하는 함수에서 오류가 발생하는 현상입니다. 배열과 함수 내부를 Data를 추가하도록(Data를 push 하도록) 정의하였지만 정상적으로 추가되지 않아서 발생하는 오류입니다. Cannot read property 'push' of undefined의 에러가 발생할 때에는 제일 먼저 추가하려는(push 하려는) 배열의 형태를 확인하고, 또한 배열 선언을 확인해봐야될것입니다.
jQuery의 .fadeToggle() 함수 jQuery의 .fadeToggle() 함수는 요소의 투명도를 조절하는 함수로써 보이는 요소는 보이지 않게, 보이지 않는 요소는 보이도록 하는 함수입니다. fadeToggle() 함수를 사용하여 투명도(opacity)를 조절하여 0으로 낮췄을때에 display 속성을 none 처리하여 페이지의 레이아웃 영향을 미치지 않도록 합니다. 옵션에 있는 duration을 조정하여 값에 따라서 속도를 조절하도록 가능합니다.(단위값은 밀리세컨드입니다.) // fadeToggle() 함수 사용법 .fadeToggle( [duration], [easing], [callback] ) duration - 시간 값 easing - 특수한 효과 callback - 콜백 함수 dura..
자바스크립트(Javascript)의 search() 함수 자바스크립트(Javascript)의 search() 함수는 문자열에서 조건 문자열을 찾아서 몇 번째 위치에 확인을 해주는 함수입니다. 매칭 되는 첫 번째로 매치되는 인덱스를 반환하게 되지만, 만약 찾지 못한다면 -1을 반환하게 됩니다. 쉽게 말하자면 검색되는 문자열의 위치값을 반환하게 됩니다. //search() 함수 사용방법 문자열.search( [찾기위한 문자열] ) let test1 = "Hello World"; let test2 = "안녕하세요 자바스크립트"; console.log(test1.search("wor")); console.log(test2.search("자바스크립트")); console.log(test1.search("Hello..
자바스크립트(Javascript)로 스크린 가로길이를 체크할 때에는 두 가지의 함수를 사용하여 체크를 할 수 있습니다 첫 번째로는 스크린 전체 가로길이를 체크하는 방법이며, 두 번째로는 사용이 가능한 가로길이를 체크하는 방법입니다. //모니터 전체 가로 길이의 확인 screen.width //모니터 사용가능 가로 길이의 확인 screen.availWidth 자바스크립트(Javascript)로 스크린 높이를 체크하는 방법도 넓이를 체크하는 방법과 같이 두가지의 함수를 사용하여 체크를 할 수 있습니다. 전체 모니터의 높이와 사용 가능한 모니터 높이를 제크 하는 방법입니다. //모니터 전체 높이 확인 screen.height //모니터 사용가능 높이 확인 screen.availHeight
Http로 URL값을 전달할 때 오직 영문자와 숫자만으로 전달 시에 인코딩이 필요할 때가 있습니다. 다양한 특수문자나 문자가 URL에 포함되어 전달될 때에 제대로 인식을 하지 않는 경우가 발생하기 때문입니다. 자바스크립트(Javascript)의 encodeURIComponent() 함수는 영문자의 대,소문자, 숫자 그리고 *-_. 을 제외하고 모든 문자를 유니코드 형식으로 변환하여 주게 됩니다. 인터넷 URL에 사용되는 특수문자 :;/=?& 특수문자까지 모두 변환을 하여 인터넷 주소를 하나의 변수에 넣을 수 있습니다. https://www.w3schools.com/tags/ref_urlencode.asp HTML URL Encoding Reference HTML URL Encoding Reference ..
웹 페이지 개발 중에 input Text에 숫자만 입력하는 부분이 많이 있습니다. 그중에 자바스크립트(Javascript) 방법 중 가장 많이 사용되는 방법을 알아보도록 하겠습니다. 자바스크립트(Javascript)의 정규식 사용 자바스크립트(Javascript)의 oninput 이벤트 속성에 넣어서 정규식을 입력하는 방법입니다. 또 하나는 자바스크립트(Javascript)의 onKeup 이벤트 속성에 정규식을 입력하는 방법입니다. 자바스크립트(Javascript)의 함수 사용 자바스크립트(Javascript)의 onkeypress 이벤트를 사용하여 키보드 이벤트 keycode를 제어함으로써 숫자만 입력을 가능하도록 하는 방법입니다. function checkNumber(){ if(event.keyCod..
자바스크립트의 제이쿼리(jQuery)를 사용하여 테이블 형식의 Row를 Drag and Drop 하는 라이브러리입니다. Drag and Drop를 통하여 테이블 게시글 순서를 변경하는데 많이 사용됩니다. jquery.tablednd.js 라이브러리 페이지 https://isocra.com/2008/02/table-drag-and-drop-jquery-plugin/ Table Drag and Drop JQuery plugin I’ve been using JQuery for a while now and really agree with its tag line that it’s the “The Write Less, Do More, JavaScript Library”. We’ve also got this code..
HTML의 input text의 Value값의 maxlength 속성을 이용하여 입력받을 데이터의 최대 크기 및 최소 크기를 설정이 가능합니다. 하지만 maxlength 속성은 한글과 영문, 숫자, 특수문자 등을 고려하지 않고 있습니다. 단순하게 문자열의 Length으로 입력을 제한하고 있는 경우가 많습니다. 따라서 이때에는 입력받는 데이터의 length 보다는 Byte를 체크하고 있습니다. 특히 input Text가 아닌 textarea 경우에는 maxlength를 체크하기 어렵습니다. 인코딩에 따라서 한글, 영문, 숫자, 특수문자 등 모두가 Byte가 다르게 설정됩니다. 보통 한글은 2~3 Btye이기 때문입니다. 웹사이트를 서핑하는 도중에 Byte 길이를 체크하는 여러 방법을 찾았습니다. //FOR..
웹페이지에서 Popup창을 열고 input Text 창에 웹페이지 URL을 작성한 뒤에 복사하기 쉽도록 URL 전체를 선택하도록 하는 경우가 있습니다. 이는 제일 먼저 Popup창을 열게 하고 나서 input 창에 focus를 이동하도록 한 뒤에 선택하도록 하면 됩니다. Ctrl + C로 아래의 URL을 복사. //Foucs 이동후에 onfocus="this.select()" input창 text 선택 닫기 제이쿼리(Jquery)의 포커스 강제이동 함수는 focus()입니다.