dataset

<li class="tab-button" data-id="0">Products</li>

dataset은 화면에서 보이지 않게 데이터를 숨겨 둘 수 있는 방법으로 HTML5에서 새로 확장된 속성

document.querySelector('.tab-button').dataset.id;
// 출력 결과 '0' 

js011.html

<li class="tab-button" data-id="0">Products</li>
<li class="tab-button orange" data-id="1">Information</li>
<li class="tab-button" data-id="2">Shipping</li>

app.js

$('.list').click(function(e){
  tabOpen(e.target.dataset.id);
})

이렇게 하면 기존의 코드보다 많이 줄여서 작성할 수 있다.

기존의 방법대로 해도 괜찮지만 내가 짠 소스코드를 어떻게 하면 더 줄이고

가독성을 좋게 할 수 있나 고민하는게 실력향상에 많은 도움이 된다.