[Javascript] active 값 활성화하기

 

 

 

<ul class="nav nav-pills flex-column mb-auto">
    <li class="nav-item">
        <a href="/account/save" class="nav-link" aria-current="page">
            계좌 생성
        </a>
    </li>
    <li>
        <a href="/account/list" class="nav-link" >
            계좌 목록
        </a>
    </li>
</ul>

<script>
	//현재 페이지의 URI 가져오기
	var currentUri = window.location.pathname;
	
	// 모든 링크 요소 가져오기
	var links = document.querySelectorAll(".nav-link");
	
	// 각 링크 요소에 대해 현재 페이지 URI와 비교하여 active 클래스를 설정
	links.forEach(function(link) {
	    if (link.getAttribute("href") === currentUri) {
	        link.classList.add("active");
	    }
	});
</script>