jQuery를 활용한 XML data island 변경 Name achor ( 2013-11-16 22:50:04 Hit: 2790 Vote: 79 ) Homepage http://empire.achor.net Category 웹개발 2000년 초반 유행한 XML data island. XML 형식의 data를 직접 컨트롤 할 수 있어서 간단하게 소식을 전하기엔 매우 편리하긴 했지만 IE 밖에 지원하지 않는 치명적인 단점이 있었지요. 결국 웹표준이 중시되는 지금에 와서는 MS 또한 지원을 공식적으로 중단하여 IE10부터는 IE에서조차 사용이 불가능 해졌습니다. http://msdn.microsoft.com/ko-kr/library/ie/hh801224(v=vs.85) 어디선가 XML data island 방식의 게시판을 jQuery로 변환하는 걸 본 적은 있는 듯 한데 다시 찾으려니 쉽지 않아 짬을 내 후딱, 직접 만들어 보았습니다. 요즘 jQuery의 정교함에 새삼 놀라고 있기도 하여 연습 삼아. 물론 저는 단순 취미로 웹개발을 즐길 뿐, 전문적인 개발자는 아니기에 코드의 수준은 매우 낮습니다. 곧 저와 같은 어려움을 겪은 분들이라면 참고는 하시되 코드는 직접 좀 더 세련되어 짜시길 추천 드립니다. -__-; 예전 XML data island의 코드는 아래와 같습니다. 10년 전 짠 코드라서 table로 틀을 잡고 있습니다. -__-; 일단 html 내 코드는 아래와 같이 바꿨습니다. 6줄씩 표현하고 있어서 cont0부터 cont5까지 id를 부여했고, 이전, 다음 페이지를 계산하기 위해 xmlpagepnum, xmlpagennum으로 hidden값을 부여해 놨습니다. 다음 javascript function을 2개 만들었는데, acxmlboard는 레퍼런스처럼 제공되는 jQuery의 DOMParser 모델을 차용하여 xml file을 읽어 구조화 하였고, processXMLDoc function으로 xml data를 각 요소별로 지정된 위치에 표현하였습니다. 맨 처음, 맨 마지막 페이지를 고려하여 페이지 이동을 설정하였고요. 완성된 화면은 http://empire.achor.net 화면 좌측 상단의 News를 통해 확인하실 수 있습니다. 공개하기엔 코드가 너무 지저분 하고, 수준 낮습니다만 (함수명이나 변수명도 대충 막 정해져 있고, -__-;) 이제는 쓰지 않아 반드시 변화가 필요함에도 한국어로 된 XML data island에 대한 정보가 너무 없어 일단 적어둡니다. 누군가에겐 도움이 되시길. - achor 본문 내용은 4,010일 전의 글로 현재의 관점과 다를 수 있습니다. Post: http://achor.net/board/blog/10 Trackback: http://achor.net/tb/blog/10 RSS: http://achor.net/rss/blog Share Tag jQuery, XML, 웹개발, 프로그래밍 각 Tag는 , 로 구분하여 주십시오. - 웹개발: 홈페이지 글작성과 동시에 자동으로 Twitter에 전송되는 기능 이야기 (2010-09-14 23:26:28)- 웹개발: Smart Phone User Agent (2010-04-17 20:28:19)- 웹개발: Google reCAPTCHA (2016-04-18 01:02:51)- 웹개발: SNS 덧글 확인을 한 번에! Social Reply! (2011-03-02 03:34:36)- 웹개발: 아처다이어리 App (2014-05-23 01:11:08)- 웹개발: 아처제국 미러사이트 (2014-12-30 01:24:09)- jQuery: jQuery 셀렉터 (2013-11-16 14:24:33)- jQuery: jQuery 기본 (2013-11-12 16:23:02)- 웹개발: 네이버 소셜앱 (2010-08-09 03:08:10)- 웹개발: prby.me 업그레이드 (2013-11-03 01:26:19) 10 1 1 No Category1 Category2 Subject Date Hit 10IT웹개발 jQuery를 활용한 XML data island 변경2013/11/162790 9IT모바일 주파수 경매2013/09/042905 8디지털마케팅Platform Facebook은 영원할 것인가?2011/06/0615321 7디지털마케팅Seach Google +1 Button2011/06/0311101 6IT웹개발 CKFinder 한글파일명 문제 해결 방법2011/06/0210205 5디지털마케팅Seach meta tag를 통해 검색엔진 접근을 제한하는 방법2011/05/3113773 4디지털마케팅Seach robots.txt를 통해 검색엔진 접근을 제한하는 방법2011/05/3111581 3IT웹개발 CKFinder를 활용한 웹앨범 제작 방법2011/05/2411268 2디지털마케팅Seach RSS 피드, 블로그를 검색엔진, 메타블로그에 등록하자2011/05/2311213 1디지털마케팅Seach 중복되는 링크를 위해 canonical link를 사용하자2011/05/2310987 1 SubjectContentsCategoryTag