분류 전체보기 썸네일형 리스트형 제이쿼리(jQuery) Select(셀렉트 박스) 사용법 정리 안녕하세요. 루미오입니다. jQuery에서의 Select 사용법을 정리해 보겠습니다. 순서 ● HTML Select 선언 ● 변경 감지 (Change Event) ● Value 알아내기 ● Value 바꾸기 ● 개수 확인 ● Select Box Disabled ● Option Disabled ● 전체 Source Code & 바로 Test [jsfiddle] 하단의 → 코드 확인 및 테스트 버튼을 클릭하면 jsfiddle에서 바로 Test해 보실 수 있습니다. ● HTML Select 선언 Indian-Red Red Dark-Red Light-Green Green Dark-Green Light-Blue Blue Dark-Blue Gray Black tag를 사용하고 id, name, value를 설정할 .. 제이쿼리(jQuery) Radio(라디오 버튼) 사용법 정리 안녕하세요. 루미오입니다. jQuery에서의 Radio 사용법을 정리해 보겠습니다. 순서 ● HTML Radio 선언 ● Radio 변경 감지 (Change Event) ● Checked/Unchecked 찾기 ● 상태 바꾸기 (Radio 1개) ● 상태 바꾸기 (전체) ● Radio Value 알아내기 ● Radio 개수 확인 ● Disabled 확인 ● Disabled 설정/해제 ● 전체 Source Code & 바로 Test [jsfiddle] 하단의 → 코드 확인 및 테스트 버튼을 클릭하면 jsfiddle에서 바로 Test해 보실 수 있습니다. ● HTML Radio 선언 Colors PINK RED ORANGE YELLOW GREEN CYAN tag에 type은 radio를 사용하고 id, na.. 제이쿼리(jQuery) Checkbox 사용법 정리 안녕하세요. 루미오입니다. jQuery에서의 Checkbox 사용법을 정리해 보겠습니다. 순서 ● HTML Checkbox 선언 ● Checkbox 변경 감지 (Change Event) ● Checked 여부 확인 ● 상태 바꾸기 (Checkbox 1개) ● 상태 바꾸기 (Checkbox 전체) ● Checkbox Value 알아내기 ● Checkbox 개수 확인 ● Checkbox Array에 넣기 ● Disabled 확인 ● Disabled 설정/해제 ● 전체 Source Code & 바로 Test [jsfiddle] 하단의 → 코드 확인 및 테스트 버튼을 클릭하면 jsfiddle에서 바로 Test해 보실 수 있습니다. ● HTML Checkbox 선언 PINK RED ORANGE YELLOW GRE.. 자바스크립트(JavaScript) 문자열 찾기 안녕하세요. 루미오입니다.JavaScript에서 문자열을 찾아야 할 때 어떤 함수를 사용할까요? 가장 많이 쓰는 함수는 indexOf(), lastIndexOf() 함수가 아닐까 생각합니다. 익숙한 함수입니다. 사실 정규식을 안 쓰면 선택의 여지가 없었습니다. 하지만 ES6부터는 startsWith(), endsWith(), includes() 함수를 제공하기 때문에 용도에 따라 선택할 수 있게 되었습니다. 물론 복잡한 검색은 여전히 정규식을 사용하는 search(), march() 함수를 사용하면 됩니다. 이제 하나씩 알아보겠습니다. 순서 ● indexOf() : 문자열 앞에서부터 특정 문자열 위치 찾기 ● lastIndexOf() : 문자열 뒤에서부터 특정 문자열 위치 찾기 ● startsWith().. 자바스크립트(JavaScript) String.prototype.includes() 폴리필(polyfill) 안녕하세요. 루미오입니다. JavaScript는 특정 문자열의 포함여부를 확인하는 includes() 함수를 ES6부터 제공하고 있습니다. 현재 IE에서는 사용할 수 없습니다. 물론 indexOf() 함수를 사용해서 특정 문자열이 포함되었는지 찾을 수 있지만, includes() 함수를 사용한다면 코드가 더 명확해지겠지요. 오늘은 includes() 함수의 폴리필을 만들어 보겠습니다. 순서 ● String.prototype.includes() 폴리필(polyfill) ● String.prototype.includes() 사용법 하단의 → 코드 확인 및 테스트 버튼을 클릭하면 jsfiddle에서 바로 Test해 보실 수 있습니다. String.prototype.includes() 폴리필 if(!String.. 자바스크립트(JavaScript) String.prototype.endsWith() 폴리필(polyfill) 안녕하세요. 루미오입니다. JavaScript는 특정 문자열로 끝나는지 확인하는 endsWith() 함수를 ES6부터 제공하고 있습니다. 현재 IE에서는 사용할 수 없습니다. 물론 lastIndexOf() 함수를 사용해서 특정 문자열로 끝나는지 찾을 수 있지만, endsWith() 함수를 사용하면 코드의 가독성이 좋아지겠지요. 오늘은 ennsWith() 함수의 폴리필을 만들어 보겠습니다. 순서 ● String.prototype.endsWith() 폴리필(polyfill) ● String.prototype.endsWith() 사용법 하단의 → 코드 확인 및 테스트 버튼을 클릭하면 jsfiddle에서 바로 Test해 보실 수 있습니다. String.prototype.endsWith() 폴리필 /* Strin.. 자바스크립트(JavaScript) String.prototype.startsWith() 폴리필(polyfill) 안녕하세요. 루미오입니다.JavaScript는 특정 문자열로 시작하는지 확인하는 startsWith() 함수를 ES6부터 제공하고 있습니다. 현재 IE에서는 사용할 수 없습니다. 물론 indexOf() 함수를 사용해서 특정 문자열로 시작하는지 찾을 수 있지만, startsWith() 함수를 사용하면 코드가 더 명확해지겠지요. 오늘은 startsWith() 함수의 폴리필을 만들어 보겠습니다. 순서 ● String.prototype.startsWith() 폴리필(polyfill) ● String.prototype.startsWith() 사용법 하단의 → 코드 확인 및 테스트 버튼을 클릭하면 jsfiddle에서 바로 Test해 보실 수 있습니다. String.prototype.startsWith() 폴리필 /.. 자바스크립트(JavaScript) String.prototype.trimEnd String.prototype.trimRight 폴리필(polyfill) 안녕하세요. 루미오입니다. 순서 ● trimtrimEnd(), trimRight() 폴리필(polyfill) ● trimtrimEnd(), trimRight() 사용법 하단의 → 코드 확인 및 테스트 버튼을 클릭하면 jsfiddle에서 바로 Test해 보실 수 있습니다. JavaScript는 문자열의 뒤의 공백을 제거하는 trimEnd(), trimRight() 함수를 제공합니다. trimRight()는 trimEnd()의 alias입니다. 하지만 IE에서 전혀 지원하지 않고 Chrome 66 이상 Firefox 61 이상에서만 지원합니다. 그렇기 때문에 호환성을 위해서 동일한 기능의 폴리필을 적용해야 합니다. trimEnd(), trimRight() 폴리필(polyfill) if(!String.prot.. 자바스크립트(JavaScript) String.prototype.trimStart String.prototype.trimLeft 폴리필(polyfill) 안녕하세요. 루미오입니다. 순서 ● trimStart(), trimLeft() 폴리필(polyfill) ● trimStart(), trimLeft() 사용법 하단의 → 코드 확인 및 테스트 버튼을 클릭하면 jsfiddle에서 바로 Test해 보실 수 있습니다. JavaScript는 문자열의 앞의 공백을 제거하는 trimStart(), trimleft() 함수를 제공합니다. trimleft()는 trimStart()의 alias입니다. 하지만 IE에서 전혀 지원하지 않고 Chrome 66 이상 Firefox 61 이상에서만 지원합니다. 그렇기 때문에 호환성을 위해서 동일한 기능의 폴리필을 적용해야 합니다. trimStart(), trimLeft() 폴리필(polyfill) if(!String.prototy.. 자바스크립트(JavaScript) String.prototype.trim 폴리필(polyfill) 안녕하세요. 루미오입니다. 순서 ● String.prototype.trim() 폴리필(polyfill) ● String.prototype.trim() 사용법 하단의 → 코드 확인 및 테스트 버튼을 클릭하면 jsfiddle에서 바로 Test해 보실 수 있습니다. JavaScript는 문자열의 앞, 뒤의 공백을 제거하는 trim() 함수를 제공합니다. 하지만 IE 9 이상에서만 지원하기 때문에 호환성을 위해서 동일한 기능의 폴리필을 적용해야 합니다. String.prototype.trim() 폴리필(polyfill) if(!String.prototype.trim) { String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g,''); }; }.. 이전 1 2 다음
