html페이지에서 id갑을 체크하여 출력 할려합니다

html페이지에서 id갑을 체크하여 출력 할려합니다

QA

html페이지에서 id갑을 체크하여 출력 할려합니다

답변 2

본문

html페이지에서 id갑을 체크하여 div에 style="display:block;"추가하 할려합니다

 

주소창에서 id=1일대 display:block;하고 나머지는 display:none;로 하게 할려고 합니다

<div class="list_1" style="display:block;"></div>

<div class="list_2" style="display:none;"></div>

<div class="list_3" style="display:none;"></div>

<div class="list_4" style="display:none;"></div>

 

 

php페이지 아니고 html페이지입니다

이 질문에 댓글 쓰기 :

답변 2


<div class="list_1"></div>
<div class="list_2"></div>
<div class="list_3"></div>
<div class="list_4"></div>
<script>
n = location.href.split("?id=")[1];
for (i = 1; i <= 4; i++) document.querySelector(".list_" + i).style.display = "none";
document.querySelector(".list_" + n).style.display = "block";
</script>

<script>
  // URL에서 id 값을 가져옵니다.
  var id = window.location.href.split('?')[1].split('=')[1];
  
  // id 값에 해당하는 div의 스타일을 변경합니다.
  if (id === '1') {
    document.getElementById('list_1').style.display = 'block';
  } else {
    document.getElementById('list_1').style.display = 'none';
  }
  if (id === '2') {
    document.getElementById('list_2').style.display = 'block';
  } else {
    document.getElementById('list_2').style.display = 'none';
  }
  if (id === '3') {
    document.getElementById('list_3').style.display = 'block';
  } else {
    document.getElementById('list_3').style.display = 'none';
  }
  if (id === '4') {
    document.getElementById('list_4').style.display = 'block';
  } else {
    document.getElementById('list_4').style.display = 'none';
  }
</script>
<div id="list_1" class="list_1" style="display:none;">List 1</div>
<div id="list_2" class="list_2" style="display:none;">List 2</div>
<div id="list_3" class="list_3" style="display:none;">List 3</div>
<div id="list_4" class="list_4" style="display:none;">List 4</div>
답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 313
© SIRSOFT
현재 페이지 제일 처음으로