Quick start

step 1. Downloads에서 받은 data-view.min.js파일을 html안에 script를 추가합니다.

아래 스크립트를 추가하면 dataview라는 객체가 생성되고, 초기화 됩니다.

(dataview는 jquery를 기반으로 작성되었습니다. dataview를 사용하려면 dataview보다 먼저 jquery를 추가해야합니다.)

<!-- jquery script -->
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<!-- dataview script -->
<script src="your_path/data-view.min.js"></script>

step 2. tag에 data-view 속성으로 사용할 id를 지정하고, tag안에 출력할 데이터의 속성을 {{속성}}의 형식으로 넣어 줍니다.

<div data-view="foo" >
  {{ hello }} <br>
  {{ datetime }}
</div>

step 3. javascript 코드에서 위에서 지정된 data-view의 id와 object로 해당 html을 변경 할 수 있습니다.

<script>
	var obj = {
		hello : "hello??",
		name : "my name"
	};
	
	// dataview.change 함수를 호출합니다.
	foo.change(obj);
	// 또는
	dataview.change("foo", obj);

</script>

결과. 

<div data-view="foo" >
  hello?? <br>
  my name
</div>

만약 tag의 attribute를 data-view가 아닌 다른 것으로 사용하고 싶은 경우 script태그에 아래와 같이 적으세요.

data-view가 아닌 "dv"이라는 attribute로 사용하고 싶은 경우

<script src="your_path/data-view.min.js?attr=dv"></script>

위와 같이 tag attribute를 dv설정 한 경우 data-view 대신 dv라는 attribute로 사용 할 수 있습니다.

<div dv="foo" >
  {{ hello }}
</div>