> For the complete documentation index, see [llms.txt](https://triplexlab.gitbook.io/vanilla-js/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://triplexlab.gitbook.io/vanilla-js/practice/undefined-1.md).
# 카운터 만들기
### DOM 요소를 비구조화 할당 방식으로 넣어서 작성해보자!
```markup
0
```
```javascript
// index.js
const number = document.querySelector('.number');
const buttons = document.querySelectorAll('button');
const [increase, decrease] = buttons; //querySelectorAll로 DOM 요소를 배열로 받아온것을 비구조화 할당 방식으로 넣은것이다.
increase.onclick = () => {
const current = parseInt(number.innerText);
number.innerText = current + 1;
};
decrease.onclick = () => {
const current = parseInt(number.innerText);
number.innerText = current - 1;
}
```
{% file src="/files/-M42pzDPle4OgWOtosb6" %}
카운터 만들기
{% endfile %}