지난 시간에 이어 Ajax 프레임워크의 핵심을 이루는 기능을 실제로 구현해 보자. XForms문서를 파싱하고 구조화하는 부분을 중점적으로 설명하고, 서버와의 통신을 맡는 Submission과 데이터를 담고 있는 인스턴스의 구현을 논의해 본다. 그 외에 XForms의 Action과 Event를 등록 및 발생시키는 이벤트 처리와 사용자 이벤트 등록에 대해 다루고 마지막으로 유용한 XML 관련 Utility 함수를 몇 가지를 구현한다.

XForms 문서의 형태에 대해 2회 연재에서 각 부분을 나눠 설명한 바 있다. 각 부분에 해당하는 의미와 기능에 대한 것은 2회 연재를 참조하면 좋을 것이다.

XForms 문서 파싱 및 객체 구조화
이제 XForms 문서를 파싱해 JavaScript 영역으로 가져와 객체로 구조화하는 작업을 진행 할 것이다. 우리가 파싱할 전체 XForms 문서가 <리스트 1>에 나타나 있다.

XForms 문서의 Loading
XForms 문서는 XML의 형태로 이뤄져 있다. 이러한 XML 문서를 DOM(Document Object Model)으로 객체화한다면 DOM 객체에 제공되는 API를 사용해 편리하게 파싱 작업을 진행 할 수 있다. DOM은 브라우저마다 생성 방식이 다르지만 API들은 표준에 의거하기 때문에 Cross Browsing이 가능하다.
지난 시간에 구현했던 imports 함수는 지정된 URL에 접근해 responseText를 얻어 와서 이를 globalEval하는 작업이었다. 이를 응용해 XML 문서를 DOM으로 얻어오는 함수를 만들어 보자. imports 함수에서 사용된 WebSquare.BootLoader.getText(url) 함수는 해당 URL에 접근해 responseText를 반환하는 함수임을 다시 떠올리면서 <리스트 2>의 구현을 살펴보자.



이렇게 구현한 WebSquare.xml.load 함수를 통해 우리는 해당 URL에서 XForms 문서에 접근해 이를 DOM 형태로 받을 수 있게 되고 이를 이용해 파싱 작업을 진행한다.