var grid = webponent.grid.init(table, template);

 위와 같이 그리드 객체를 생성하였을때 아래와 같은 방식으로 그리드의 데이터 모델에 접근 할 수 있습니다.

grid.markup.area

@type {Node} 그리드 최상위 랩퍼

grid.markup.wrapper

@type {Node} 그리드 랩퍼

grid.markup.main

@type {Object} 그리드 메인관련 마크업

grid.markup.main.wrapper

@type {Node} 래퍼

grid.markup.main.header

@type {Object} 그리드 헤더에 관한 마크업을 매핑

grid.markup.main.header.wrapper

@type {Node} 그리드 헤더 랩퍼

grid.markup.main.header.scroller

@type {Node} 그리드 헤더의 스크를 컨테이너

grid.markup.main.header.inner

@type {Node} 그리드 헤더 테이블을 감싸고 있다.

grid.markup.main.header.table

@type {Node} 그리드 헤더에 실제로 그려지는 테이블

grid.markup.main.header.thead

@type {Node} 그리드 헤더 테이블에 들어가는 thead

grid.markup.main.body

@type {Object} 그리드 바디에 관한 마크업을 매핑

grid.markup.main.body.wrapper

@type {Node} 그리드 바디 랩퍼

grid.markup.main.body.scroller

@type {Node} 그리드 바디의 스크를 컨테이너

grid.markup.main.body.inner

@type {Node} 그리드 바디 테이블을 감싸고 있다.

grid.markup.main.body.table

@type {Node} 그리드 바디에 실제로 그려지는 테이블

grid.markup.main.body.thead

@type {Node} 헤더에서 복사한 thead

grid.markup.main.body.tbody

@type {Node} 메인 바디 테이블에 들어갈 tbody

grid.markup.design

@type {Object} 기능과는 관계없는 디자인 관련 요소들을 매핑

grid.markup.design.border

@type {Object} 그리드 바디와 스크롤 사이에 경계선을 그려주기 위한 노드 매핑

grid.markup.design.border.bottom

@type {Node} 하단스크롤 경계선

grid.markup.design.border.right

@type {Node} 우측 스크롤 경계선

grid.markup.design.border.fixed

@type {Node} 틀고정부분과 아닌부분을 경계지어주는 경계선

grid.markup.design.rect

@type {Object} 사각형모양의 디자인요소

grid.markup.design.rect.rightTop

@type {Node} 그리드 상단 우측에 헤더와 스크롤 사이에 비어있는 부분을 위한 마크업

grid.markup.functional

@type {Object} 그리드의 UI기능을 위한 마크업들

grid.markup.functional.resizers

@type {Array<Node>} 컬럼 리사이저

grid.markup.functional.mainBodyHeighter

@type {Node} 가상스크롤을 사용할시 높이를 잡아주기 위한높이를 가지는 div

grid.markup.functional.freezeScroller

@type {Node} 그리드를 스크롤 할수 있게 하는 DOM. 그리드에서 표시되는 스크롤은 이 DOM이 담당한다

grid.markup.functional.freezeScrollerInner

@type {Node} 이 DOM은 그리드의 실제 가로길이와 세로길이와 동기화되어 스크롤을 한다.

grid.markup.functional.paging

@type {Node} 스크롤을 사용하지 않을 경우의 페이징 처리

grid.markup.functional.paging.wrapper

@type {Node} 페이징 WRAPPER

grid.markup.functional.paging.a

@type {Array} 페이지 a 태그

grid.markup.functional.paging.left

@type {Node} 페이지를 왼쪽으로 이동 한다.

grid.markup.functional.paging.right

@type {Node} 페이지를 오른쪽으로 이동 한다.

grid.markup.functional.paging.start

@type {Node} 첫 페이지로 이동 한다.

grid.markup.functional.paging.end

@type {Node} 마지막 페이지로 이동한다.