자바스크립트로 JSON 파싱하기 (jQuery)

이 포스트에서는 제이쿼리를 써서 JSON 데이터를 파싱하는 방법을 설명합니다. JSON 데이터 파싱 방법은 기본적으로는 XML 파싱할 때와 같지만, JavaScript Object Notation이라는 의미답게 XML 파싱에 비해 코드가 간결해진다는 특징이 있습니다. 우선 JSON 문서가 다음과 같이 있다고 가정합니다. (편의를 위해 데이터를 여러 줄에 걸쳐서 전개하였습니다.) { “name”: “여자친구”, “members”: [ “소원”, “예린”, “은하”, “유주”, “신비”, “엄지” ], … 더 보기 “자바스크립트로 JSON 파싱하기 (jQuery)”

자바스크립트로 XML 파싱하기 (jQuery)

이전의 자바스크립트로 XML 파싱하기에서는 제이쿼리(jQuery)를 사용하지 않고 순수 자바스크립트로만 AJAX를 사용하였습니다. 하지만 제이쿼리를 이용하면 코드를 더욱 간결하게 만들 수 있습니다. 제이쿼리를 사용하여 이전 포스트의 자바스크트 부분의 코드를 다시 작성할 경우, 다음과 같이 됩니다. <!DOCTYPE html> <html> <head> <meta charset=”UTF-8″> <script type=”text/javascript” src=”https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js”></script> <script type=”text/javascript”> $(document).ready(function(){ $.ajax({ type: “GET”, url: “xml_sample.xml”, dataType: “xml”, success: function (xml) … 더 보기 “자바스크립트로 XML 파싱하기 (jQuery)”

자바스크립트로 XML 파싱하기

이 포스트에서는 자바스크립트로 XML 문서의 데이터를 읽어들이는 AJAX 기법을 사용하는 방법을 설명합니다. 우선, XML 문서가 다음과 같이 있다고 가정합니다. <?xml version=”1.0″ encoding=”UTF-8″?> <girlgroup> <name>여자친구</name> <members> <member>소원</member> <member>예린</member> <member>은하</member> <member>유주</member> <member>신비</member> <member>엄지</member> </members> <albums> <album order=”EP 1집”>Season of Glass</album> <album order=”EP 2집”>Flower Bud</album> <album order=”EP 3집”>Snowflake</album> <album order=”정규 1집”>LOL</album> </albums> </girlgroup> 이 XML 문서의 파일 이름이 … 더 보기 “자바스크립트로 XML 파싱하기”

자바스크립트로 Form 인자값 얻기 (GET)

HTML 문서의 폼(Form)을 보내는 방법은 GET 방식과 POST 방식이 있습니다. URL에 데이터를 실어 보내는 GET 방식은 데이터를 자바스크립트로 얻을 수 있습니다. 자바스크립트로 GET 인자값을 얻는 함수 선언은 다음과 같습니다. function receive_get_data(param) { var result = null, tmp = []; var items = window.location.search.substring(1).split(“&”); for (var i = 0; i < items.length; i++) { tmp = … 더 보기 “자바스크립트로 Form 인자값 얻기 (GET)”

접속한 기기가 모바일인지 아닌지 확인하는 자바스크립트

이 글은 필자의 티스토리 블로그에서 포크하였습니다. (원글 링크) 요즘 웹 사이트를 보면 모바일로 접속하였느냐 일반 PC로 접속하였느냐에 따라 페이지가 다르게 보여지는 경우들이 있는데요. 이 포스트에서는 모바일 접속 여부에 따라 다르게 보여지는 기능을 구현하기 위한 자바스크립트를 설명합니다. /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); 일단 이 한 줄의 코드만으로도 모바일인지 아닌지 간단하게 검출 가능합니다. 만약 모바일에서 접속했다면 true 값을 돌려줄 것이고 … 더 보기 “접속한 기기가 모바일인지 아닌지 확인하는 자바스크립트”

HTML5 시대에 맞게 홈페이지 코딩하기

1990년대 후반에서 2000년대 초반 즈음에 한국에 인터넷이 보급되기 시작하면서 개인 홈페이지 열풍이 불었을 때 홈페이지의 HTML 코딩을 다음과 같이 했을 것입니다. <html> <head> <title>제목</title> </head> <body background=”배경그림” bgcolor=”배경색” text=”글자색” link=”링크색” vlink=”방문링크색” alink=”활성링크색”> <p><font size=”5″ color=”글자색”>Hello, world!</font></p> <p>Hello, world!</p> </body> </html> 그 당시는 컴퓨터로만 인터넷을 하던 시대였지만, 스마트폰으로 인터넷을 하는 시대가 오면서 오늘날 이런 형식의 홈페이지 … 더 보기 “HTML5 시대에 맞게 홈페이지 코딩하기”