div~/dvi 제가 이해한게 맞는건가요?

<div data-inven-toggle="A"> A 버튼 </div>
<div data-inven-id="A" style="display:none;">A 영역

<div data-inven-toggle="B"> B 버튼 </div>
<div data-inven-id="B" style="display:none;">B 영역</div>

</div>

div 색상마다 각각의 박스(?)라고 생각하면되는건가요??

다시 말해

빨간 div~/dvi 가 한박스

연두 div~/div가 한박스

연두 div~/dvi 사이에 있는

푸른 div~/dvi 와 검은 div~/dvi가 각각 한박스 라고 이해하면되나요??

그래서

A버튼 누르면 연두색 div~/dvi 안에있는 B버튼과 B 영역이 나오는거구요