javascript 팁이 있는 곳입니다.
  • 웹미니 한줄 전광판 영역 입니다.
글 수 109

0

조회 수 : 7562 신고 : 0

작성자 : 이병준
포인트 : 0 | 레벨 : 0
미리보기 :  
자.. 5탄에 너무 어려워 골때리다는 분이 많아서 오늘은 그냥 번외를 준비했습니다.
오늘은 좀 재밌는 걸 준비했는데요.
자.. 먼저 이걸 보시죠.

mypage.html?page=write&where=isit

음.. 그냥 URL이죠. 그리고 ? 뒤에 질의문이 들어가있죠. 쿼리스트링이라 하지만 우리말로 하면 질의문이잖아요..ㅋㅋㅋㅋ
뭐.. 이걸 서버사이드에선 어떻게 처리할까요?
먼저 PHP요~
$_GET['page'];

ASP(.net)요~
VB:
Request.QueryString("page")
C#,JScript,J#...:
Request.QueryString["page"]

JSP요~
...안해봐서.. 댓글로 참조부탁요.

그외에도 CF,Mac,Perl,CGI등등등.. 다채롭죠.

그렇다고 질의문을 내맘대로 꾸미고 싶다. 질의문 전체를 참조하려면 어떻게 해야합니까?
PHP요~
$_SERVER['QUERY_STRING'];

ASP(.net)요~
VB:
Request.ServerVariables("QUERY_STRING")
C#,JScript,J#...:
Request.ServerVariables["QUERY_STRING"]

JSP요~
.....................몰라요.

이상 서버단이었습니다.
근데 자바스크립트 강좌인데 왜 난데없이 질의문 가지고 난리입니까?
오늘은 자바스크립트로 질의문 다루는 걸 하겠다는겁니다.
헐..자스도 질의문 다루는 기능이 있습니까?????????????????????????

아뇨. 없어요..자체적으론 없습니다..ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ
하지만 URL을 가공해서 처리는 할 수 있습니다.
location 객체. 음.. URL을 얻어올때 주로 쓰는 객체이죠. 네..
이 location에 href 속성으로 전체 URL을 얻어올 수 있죠? 파일명부터 질의문까지.
근데.. 이걸 가공하기엔 좀 귀찮고.. 하지만 하늘은 우릴 버리지 않으셧습니다.
앵커를 참조하라고 location 객체에 search 속성을 내려주셨습니다.
이 속성에는 # 뒤에 들어간 앵커. 우리말로하면 책갈피를 보여주지만 ?을 붙인 그 뒤에 질의문도 보여주는 친절함을 선보이고 있죠.
결국 location.search는 server variables의 query_string인 셈이죠.
이제 이걸 다룰 줄 알면 오늘 골때리는 강좌는 여기서 끝입니다...

자.. 먼저, search 속성의 ?부터 제거해보기로 합시다.
var qs=location.search.replace('?','');
자스의 replace는 기본적으로 정규식의 global 속성을 주지 않는 이상 첫번째 단어만 검색하면 그걸 대체하고 끝내버리는 속성이 있습니다. 하지만 서버단의 replace는 그 반대죠.
어쨌든 substring을 쓰던 replace를 쓰던 ?을 제거하면 일단 질의문을 가공할 준비는 끝입니다. 어떻게 가공할건지는 여러분의 자유에 맡기겠지만, 저는 split을 통해 그냥 쉽게 처리할 생각입니다.
먼저 &가 들어간 단어를 기준점으로 문자를 나눕니다.
qs=qs.split('&');
이렇게 되면 질의문의 갯수만큼 나눠지겠죠. 단순히 &만 나누기때문에 &남용하면 물론 & 갯수만큼 나눠지겠지만 그건 큰 문제가 없습니다. 키=값 쌍만 있는넘만 등록하게 하면 되니까요. 그런다음에 = 기준으로 키=값을 분리해서 왼쪽은 키, 오른쪽은 값 이런식으로 하면 되죠. 그다지 어렵지는 않죠?
split 써도 되고. 정규식씨를 섭외해도 되고... 여러분이 원하는 방식으로 가공해서 처리하면 됩니다. 어때요. 쉽죠?

이렇게해서 querystring 값을 받아오는 함수는 다음과 같습니다.
function getQueryString(key){
  var qs=location.search.replace('?','');
  if(!key) return qs;
  qs=qs.split('&');
  var qsr='';
  for(i=0;i<qs.length;i++){
    if(!!qs[i]&&qs[i].indexOf('=')>-1){
      var qv=qs[i].split('=');
      if(qv[0]==key) qsr+=qv[1]+'|';
    }
  }
  qsr=qsr.replace(/\|$/,'');
  return qsr.indexOf('|')>-1?qsr.split('|'):qsr;
}
만약 하나만 나오면 하나나온 값 문자열을, 복수면 배열로 리턴하게 친절하게 꾸몄습니다.
저 잘했죠?

만약 location과 같이 기억해두고싶다면 Location.queryString을 만들고 내용을 저걸로 집어넣어도 무관합니다.

만약 RewriteMod와 같이 쓰고 싶다면 자스는 ReWrite와 무관하게 URL을 수집하기 때문에 그에 맞게 꾸미면 되겠습니다.

오늘은 그냥 골때리다기보기엔 그냥 그렇다 하겠지만 자스로도 질의문을 받아 처리할 수 있다는 사실에 오늘 재밌는 감동을 얻었군요.

번외편은 여기까지구요. 다음엔 약속대로 골때려서 돌아가시게 해드리겠습니다.
각오하고 그럼 즐코딩하셈.

아참, 덧붙여서 검색창에 js querystring 쳐보셈. 즐비하게 나오는 팁입니다..
소중한 댓글 부탁드립니다.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시 BEST 아이콘이 붙게됩니다.
추천수에 따른 배경색 보기 본문으로 바로가기
  • 추천수 50개이상
  • 추천수 30개이상
  • 추천수 20개이상
  • 추천수 10개이상
  • 추천수 3개이상
닫기

첫번째 댓글을 남겨주세요!

List of Articles
번호 제목 글쓴이 날짜 추천 수sort 조회 수
109 best of best 레이어를 이용한 움직이는 공지 title: [ani]깜빡이는 표정빽짱구 2004-03-08 34 6650
108 best of best 클릭하면 메뉴가 나타나고, 다시 클릭하면 닫히는 소스 [1] title: [ani]깜빡이는 표정빽짱구 2004-10-31 33 5887
107 hit best of best 이미지가 서서히 변하는 롤오버 효과 title: [ani]깜빡이는 표정빽짱구 2006-08-30 32 14362
106 best of best 제자리에서 페이딩되면서 바뀌며보여주는 뉴스티커 title: [ani]깜빡이는 표정빽짱구 2006-01-07 32 8458
105 best of best 원클릭으로 클립보드에 저장하기 title: [ani]깜빡이는 표정빽짱구 2004-10-27 30 7497
104 hit best of best 따라다니는 톱버튼 (파이어폭스,익스지원) title: [ani]깜빡이는 표정빽짱구 2006-03-30 29 12901
103 best of best 타이틀을 랜덤으로 바꾸기 title: [ani]깜빡이는 표정빽짱구 2006-03-28 29 9810
102 hit best of best 아이프레임 크기 자동조절 [1] title: [ani]깜빡이는 표정빽짱구 2006-05-02 28 12024
101 best of best 통통 티는 탑버튼 만들기 title: [ani]깜빡이는 표정빽짱구 2005-03-19 23 6047
100 hit best of best 자동으로 년도,월,일,요일,시간 나오게 하기 title: [ani]깜빡이는 표정빽짱구 2006-03-28 22 10948
99 best of best 텍스트 타이핑효과 title: [ani]깜빡이는 표정빽짱구 2004-04-22 22 5989
98 best of best 메트릭스 효과 문자 title: [ani]깜빡이는 표정빽짱구 2004-04-21 22 4921
97 best of best 스크롤되는 배너 title: [ani]깜빡이는 표정빽짱구 2005-03-26 21 9659
96 best of best 따라다니는 탑버튼 title: [ani]깜빡이는 표정빽짱구 2004-02-28 21 6185
95 best of best 위에서 아래로 떨어지는 메뉴 title: [ani]깜빡이는 표정빽짱구 2004-10-31 20 6103
94 best of best 출렁거리며 내려오는 공지창 title: [ani]깜빡이는 표정빽짱구 2004-04-19 20 5014
93 best of best 상태표시줄 바꿔보자2 title: [ani]깜빡이는 표정빽짱구 2004-02-07 20 4778
92 손님이 원하는색을 입력받아 배경화면으로 적용하기! title: [ani]깜빡이는 표정빽짱구 2004-02-29 19 4744
91 링크주소 가리기소스 title: [ani]깜빡이는 표정빽짱구 2004-07-21 18 7150
90 떨어지는 낙역또는 눈 title: [ani]깜빡이는 표정빽짱구 2005-11-28 17 5453