현재페이지 확인 및 색상적용

목적: 현재 페이지 URL 확인하고, 그에 따라 표시 영역 색상 적용

적용할 페이지 수만큼의 html파일이 있고, 각각에서 똑같이 아래 부분이 있다.
예제의 경우, 페이지 2개라서 표시 구간 너비를 각각 50%로 한다.

html)

<div style="width: 800px; display: flex; justify-content: space-between; margin-bottom: 30px;">
	<div id="ordQntByPrd" style="width: 50%;">
		<a href="/prd/ordQntByPrd">ordQntByPrd</a>
	</div>
	
	<div id="salesByPrd" style="width: 50%;">
	<a href="/prd/salesByPrd">salesByPrd</a>
	</div>
</div>

js)

<script>
// 현재 페이지 URL을 확인
const currentPage = window.location.pathname;

// 요소 선택
const ordQntByPrdDiv = document.getElementById('ordQntByPrd');
const salesByPrdDiv = document.getElementById('salesByPrd');

// URL에 따라 색상 변경
if (currentPage === '/prd/ordQntByPrd') {
    ordQntByPrdDiv.style.backgroundColor = '#d4d4d4';
    salesByPrdDiv.style.backgroundColor = '#f8f8f8';
} else if (currentPage === '/prd/salesByPrd') {
    salesByPrdDiv.style.backgroundColor = '#d4d4d4';
    ordQntByPrdDiv.style.backgroundColor = '#f8f8f8';
}
</script>