티스토리 뷰
자바스크립트에서 form의 데이터를 문자열로 가져오기
간단한 자바스크립트 팁에 대해서 설명하려고 합니다.
Ajax를 활용하다 보면, Form안에 있는 데이터를 문자열로 모아서 처리해야 하는 종종 경우가 있습니다.
즉, 폼 필드 내를 반복하면서 이름과 값을 추출해서 다음과 같은 형태로 리턴하는 거죠..
name=mini&title=xml&date=20080613
이런 문자열을 만들기 위한 함수를 먼저 하나 만들어 보겠습니다.
간단한 형태죠.. 먼저 encodeURIComponent는 폼의 값을 정상적으로 서버에 전송하기 위해서 자바스크립트에서 제공하는 인코딩을 수행합니다.
전송 중에 발생할 수 있는 데이터 손실을 피하기 위해 사용하는 거라고 생각하면 됩니다.
그리고 나머지는 큰 무리 없이 이해가 될 겁니다.
위의 문자열을 만들기 위해 =와 &로 연결해 주는 거니까요..
그런데 위 소스는 문제점이 두가지가 있습니다.
첫번째는 문자열이 다음과 같이 마지막에 &로 끝나게 됩니다.
name=mini&title=xml&date=20080613&
서버에서 처리하는데 큰 문제는 없겠지만 아무래도 좀 꺼림직 하죠.. ^^
하지만 그것보다 더 큰 문제가 하나 더 있습니다.
자바스크립트는 클라이언트 환경에서 실행되는 프로그램입니다.
즉, 클라이언트의 PC 상황에 따라 처리 속도가 결정되는 것이죠..
그런데 위처럼 문자열을 계속적으로 연결하게 되면 코드 실행 속도를 저하시키는 문제가 발생합니다.
이런 문제를 해결하기 위해서 자바스크립트의 배열을 활용하면 됩니다.
그럼 최적화된 소스를 한번 살펴보시죠..
이렇게 함으로써 앞에서 이야기 한 두가지 문제를 모두 해결하게 됩니다.
간단한 자바스크립트 팁이었습니다.
아.. 위 소스를 테스트 해보시려면 다음 소스가지고 하시면 됩니다.
'프로그래밍 > Java' 카테고리의 다른 글
| Javascript에서 사용하는 HTML Parser라고 합니다. (0) | 2011.10.11 |
|---|---|
| 자바 스크립트의 원격 서버 접근 및 onLoad 이벤트 처리 (0) | 2011.10.11 |
| 정규식을 활용해 Java에서 HTML 태그를 제거하는 소스 구현하기~ (0) | 2011.10.08 |
| [Java] URLConnection으로 가져올 때 UTF8과 EUC-KR 구분하기 (0) | 2011.09.27 |
| 이클립스(Eclipse) 단축키를 알아두자~~ (0) | 2011.09.23 |
댓글