LATEST POSTs 최근 등록된 포스팅 목록

• js [자바스크립트] 인코딩, escape(), encodeURI(), encodeURIComponent() 오늘은 자바스크립트의 인코딩 함수에 관하여 얘기해볼까 합니다.! 인코딩(Encoding)이란? 인코딩은 텍스트를 전송하기 위해 변환하며 문자를 ASCII 문자로 바꾸어 주는 것(아스크문자로 변환)을 말합니다. 변환하는 이유는 문자 타입이 서로 다르다면 수신받는 곳에서 잘못 해석될 수도 있으니 공통된 문자로 바꾸어

  View : 10095 / Created : 2014-07-18
• js Sizzle Selector Engine이란? 자세히 알아보기... 씨즐 셀렉터(Sizzle Selector)를 이야기하려면 우선 가장 넓리 쓰이는 자바스크립트 라이브러리 중 하나인 제이쿼리(jQuery)를 빼놓을 수 없겠죠... 이 제이쿼리에서 사용하는 셀렉터가 바로 씨즐 셀렉터(Sizzle Selector)입니다.<br

  View : 4518 / Created : 2014-06-28
  
• js [JavaScript] 인쇄창 띄우기, print() 브라우저에 있는 내용을 접속자가 인쇄가 가능하도록 출력창을 띄우게 하는 방법으로 아래의 메소드를 사용합니다.window.print();그럼 다음과 같은 내용을 방문자에게 출력할 수 있도록 하려면 아래처럼 출력 버튼을 만들어 아래의 print() 함수를 넣어주면 될 것입니다.<div class="

  View : 9068 / Created : 2014-05-29
  
• js [JavaScript] 시간 지연 함수, 일정 시간 뒤 실행시키기, setTimeout() {} 자바스크립트 함수중에서 자주 사용되는 타이머 함수가 있습니다. 바로 setTimeout()이죠! 아래는 어떻게 동작하고 사용하는지 자세히 알아보고자 합니다.# setTimeout()이란?일정 시간 후에 특정

  View : 223763 / Created : 2014-04-08
  
• js [JavaScript] 배열 값을 텍스트로 변환(하나의 텍스트로 합치기, 병합) 기존의 페이지가 아래 링크로 이동되었습니다.아래 링크를 클릭해주세요 !!링크 바로가기 >https://webisfree.com/2017-05-11/자바스크립트-배열을-텍스트로-변환-바꾸기

  View : 3991 / Created : 2014-03-11
• js [JavaScript] 새로운창(새창) 불러오기, 띄우기 현재 페이지에서 새로운 창(새창)을 띄워야 하는 경우가 있죠. 보통 새로운 알림등의 팝업을 띄우는 경우나 외부 링크(현재 호스트가 아닌 페이지)로 연결하기 위해서 많이 사용합니다. 아래는 함수는 새창을 띄우는 자바스크립트 방법입니다.window.open('이동할 url주소', '이동방법', '선택옵션', '페이지교체');위 코드를 세부적으로 설명하면...<span

  View : 7644 / Created : 2014-01-31
• js [자바크스립트] 원하는 요소 및 객체의 속성 지정하거나 불러오기 특정 태그가 가진 속성들 예를 들어 id값이나 class명이 가진 값을 알아야하는 경우 사용 가능한 함수입니다. 값을 가져오는 것도 가능하고 지정할 수도 있습니다. 이때 사용하는 함수는 아래와 같습니다.선택할 요소.getAttribute('지정할 속성', '지정할 값')선택할 요소.setAttribute('값을 불러올 속성')[ 1 ] 속성 값 지정 또는 불러오는 예제 보기<

  View : 6632 / Created : 2014-01-31
• js [자바스크립트] Bookmarklet의 활용범위 및 특징 알아보기 우리가 흔히 사용하는 북마크(bookmark)는 브라우저에 특정 페이지로 바로가기 위해 사용합니다. 자주 가는 페이지나 잊지 않기 위해 메모의 기능으로 북마크를 사용하죠... 하지만 북마크릿에 간단한 프로그래밍을 사용하면 북마크릿(bookmarklet)으로 재탄생할 수 있습니다. 이게 왜 필요하냐구요?! 북마크릿의 활용북마크릿의 장점은 가볍다는 점입니다... 가볍다? 보통의 프로그래밍은 설치부터 실행까지 단순 또

  View : 2733 / Created : 2014-01-31
• js 자바스크립트와 제이쿼리(Jquery)는 무엇이며 특징 알아보기 # JavaScript(자바스크립트)는 무엇인가?Java Script는 웹개발 스크립트 언어 중 가장 넓리 쓰이는 객체지향 언어(OOL: Object Oriented Language)이다. 개발언어는 객체지향언어와 절차지향언어와 구분되는데 최근 사용되는 언어는 거의 대부분 객체지향 언어를 사용하고 있다.무엇보다 그 이

  View : 12007 / Created : 2014-01-31
• js [자바스크립트] 화면, 브라우저, 클라이언트의 높이, 너비(폭) 불러오는 속성 동적인 화면을 구성하기 위해서는 브라우저의 크기와 현재값을 알아둘 필요가 있습니다. 현재의 디바이스가 가지는 최대 width 너비의 크기등을 말이죠. 얻을 수 있는 값들 중 크기 순으로 정렬하자면 아래와 같습니다clientHeight > offsetHeight > scrollHeight위 순서대로의 크기를 가집니다. 좀 더 자세하게 알아보도록하겠습니다.1. clientheight이 값은 스크롤바의 공간을 제외한 부분입니다

  View : 8987 / Created : 2014-01-30
• js [자바스크립트] iframe 태그에 접근해 문서 객체 DOM 요소 접근 iframe 태그를 이용해 외부 도메인 또는 URL 주소의 내용을 자신의 웹사이트에 보여주는 경우 ... 때때로 iframe의 DOM 영역에 접근할 필요가 있습니다. 이때 어떻게하면 가능한지 알아봅니다.# 자바스크립트 iframe 요소의 DOM에 접근하기iframe 태그의 DOM객체에 접근하기 위해서는 i

  View : 15255 / Created : 2014-01-30
• js [JavaScript] 마우스로 선택된 범위 값 text로 불러오기, getSelection() 자바스크립트를 사용하여 선택된 영역, 드래그 영역의 텍스트를 가져올 수 있는 방법을 알아봅니다.# 자바스크립트 getSelection() 정보특정 범위의 텍스트가 선택 된 경우 getSelection()을 사용할 수 있습니다.getSelection()만약 선택된 범위에 콘텐츠가 있는 경우 <span data-custom-s

  View : 3252 / Created : 2014-01-28
• js [JavaScript] 문자 숫자 변환, parseInt() 자바스크립트를 사용하여 데이터 타입을 숫자로 변경하는 방법에 대하여 알아볼까 합니다. 우선 자바스크립트에서 사용되는 데이터 타입에는 문자, 숫자, 불리언, Null 등 여러가지가 있습니다. 이런 형태 중 숫자타입으로 변경할 때 사용하는 함수는 아래와 같습니다.<span data-c

  View : 26922 / Created : 2014-01-25
  
• js [JavaScript] 타입이 NaN인지 확인, isNaN() 숫자 데이터를 처리하는 과정에서 사용되는 isNaN() 함수에 대하여 알아보도록 하겠습니다. isNaN() 함수는 무엇이고 어떻게 사용하는지 예제를 통해 아래에서 알아보세요. 먼저 isNaN() 함수는 무엇일까요? ! isNaN() 함수란? isNaN() 함수는 특

  View : 15117 / Created : 2014-01-25
• js [JavaScript] 변수에서 특정문자 기준 자르기(나누기), split() 특정문자를 기준으로하여 문자열을 나누거나 구분하는 방법이 필요할 때가 있습니다. 이때 자바스크립트에서는 어떻게해야할까요? 이 경우 사용가능한 방법으로 바로 split() 함수를 사용하는 방법입니다.# 자바스크립트 문자열을 배열로 변환하기, s

  View : 75678 / Created : 2014-01-25
  
• js [자바스크립트] 텍스트에서 찾는 문자의 위치(순서) 불러오기, search() 문자열에서 특정 텍스트의 위치를 알고싶을때 search() 함수를 사용합니다. 해당 함수는 특정 문자열의 위치를 숫자로 반환하여 줍니다. 자세한 내용은 아래 예제를 참고하세요.# search() 예제소스 코드보기&

  View : 3308 / Created : 2014-01-21
• js [JavaScript] 모바일 접속시 모바일 페이지로 변경 요즘 모바일 페이지는 필수라고 생각합니다. 모바일 접속자가 급성장하는 추세에 요즘 모바일 사용자가 워낙 많기 때문에 모바일 페이지를 개발 할 수밖에 없습니다. 만약 모바일로 접속한 사용자를 모바일 페이지에 이동시키려면 어떻게 할까요? 우선 navigator객체를 통해 userAgent 속성 사용하면 사용자의 접속환경을 확인할 수 있고 그 후 사용자의 접속환경 (디바이스 또는 브라우저)에

  View : 2539 / Created : 2014-01-21
• js [자바스크립트] 날짜 데이터에 불러오기(년, 일, 월), Date객체 자바스크립트를 사용하여 날짜 데이터에 접근하기 위하여는 Date 객체를 통해서 접근이 가능하다. Date 객체는 날짜 및 시간에 관련된 정보를 가지고 있다.날짜 정보를 사용할 경우 일반적으로 Date 객체를 사용하여 새로운 인스턴스를 아래와 같이 생성하여 사용한다. 간단한 사용방법은 아래와 같다. 만약 현재 날짜를 date_value 변수에 저장한다고 한다면 다음과 같이 사용할 수 있

  View : 5085 / Created : 2014-01-20
• js [자바스크립트] 백그라운드(background) 경로, 주소 불러오기, getComputedStyle() 이미지 태그를 사용하지 않고 백그라운드를 사용한 이미지의 경우 이미지 경로를 확인하려면 아래의 함수를 사용해 불러올 수가 있습니다. 그 외에도 다른 속성들 예를 들어 display나 margin등의 속성이 가진 값을 확인할 때도 아래 함수를 사용해 어떤 값이 지정되었는지 알 수 있습니다.<img src="/static/uploads/2017/1782_js

  View : 7667 / Created : 2014-01-12
  
• js [JavaScript] Select 태그의 값을 순서, Index로 찾기, selectedIndex select 태그에서 선택된 값이 있는 경우 몇번째 해당하는지 값을 알려면 어떻게 알 수 있을까요? 아래 방법은 선택된 값을 얻는 자바스크립트 방법입니다.# selectedIndex를 사용한 select 태그의 선택값 알아내기<b

  View : 20825 / Created : 2014-01-12
  
• js [Ajax] 전달받은 responseText의 데이터를 객체로 변환 및 출력하기 Ajax등의 비동기 통신으로 받은 데이터가 문자열이나 객체 구조를 띄는 경우가 있습니다. 실제로 데이터베이스 또는 로컬에 저장할때 문자열로 변환 후 저장하기도 하는데 이런 경우 다시 객체 구조로 변환해야 사용할 수 있죠. 이 방법으로 JSON.parse()를 사용합니다.<h4 data-custom-style="

  View : 7800 / Created : 2014-01-10
• js [Ajax] 비동기식 처리, XMLHttpRequest 자바스크립트를 사용하여 비동기 방식(ajax)으로 처리하는 웹사이트가 많이 늘어나고 있습니다. 그 이유는 역시 비동기식 방식(asynchronous way)이 가진 많은 장점 때문인데요...아래는 자바스크립트를 사용하여 비동기 방식의 네트워크(ajax)를 구현하는 방법에 대하여 자세히 알아보고자합니다. 그럼 우선적으로

  View : 6712 / Created : 2014-01-09
  
• js [JQuery] Input, Textarea 활성화 또는 비활성화 변경 제이쿼리를 사용하여 input 태그 그리고 textarea 태그를 활성화 또는 비활성화로 변경하는 방법을 알아봅니다. 입력폼인 위 태그를 활성화 또는 비활성화 할 경우 글 입력(작성)이 가능 또는 불가능하게 변경할 수 있습니다. 그렇다면 아래는 이를 바꾸는 방법입니다. $(ele).attr('disabled', 'disabled');# 제이쿼리 a

  View : 13545 / Created : 2014-01-09
• js [자바스크립트] replace() 문자 변환, 치환 자바스크립트를 사용해 특정 문자를 다른 문자로 치환하는 방법에 대하여 알아볼까합니다. 먼저 사용할 메소드는 replace() 입니다. 사용방법은 아래와 같습니다. str_text.replace("찾을 문자열", "변경할 문자열") 자바스크립트의 replace()함수

  View : 161557 / Created : 2014-01-09
  
• js [JQuery] 이벤트 통합 메서드의 활용, on(), off() 우선, 이벤트 통합 메서드는 JQuery 1.7 이후 버젼부터 사용이 가능합니다. 기존의 이벤트의 핸들러 함수로는 bind(), live(), delegate()가 있죠. 이 방법들 역시 사용이 가능하나 기능이 축소 및 변경되었기 때문에

  View : 23862 / Created : 2014-01-03
  
• js [JQuery] 클릭 이벤트의 반복실행, toggle() 클릭 이벤트를 구현할 때 똑같은 기능이 반복되게 하려면 어떻게할까요? 마치 스위치를 누를때처럼 말이죠. 버튼을 누를때 마다 다른 함수를 실행하거나 아니면 스위치를 켜고 끌때와 같이 딱 두개만 반복해서 계속 실행하려면 아래의 방법을 사용합니다.(아래에 나와 있지만 현재 이 기능의 대부분은 Deprecated되어 현재 예제대로 구현되지 않을 수 있습니다. 최신 버전의 jQuery에서는 다른 기능으로 toggle()이 사용되니 이 점 알아두세요!)

  View : 33485 / Created : 2014-01-03
  
• js [JQuery] 이벤트의 강제 실행, 커스텀 이벤트, trigger() 커스텀 이벤트를 만들려고 합니다. 이벤트를 실행하기 위해서는 이벤트 핸들러가 필요하죠. 클릭이나 스크롤 이동, 브라우저 사이즈 등등 몇몇의 핸들러가 작동하게 될 경우 브라우저에 이를 알리고 함수를 실행하지만 이런 이벤트 핸들러 없이도 동작이 가능하게 하려면 trigger()메소드가 필요합니다.<s

  View : 39039 / Created : 2014-01-03