js 클릭 목록 텍스트 행 표시 배경색 구현 code_javascript 기술에 해당

이 기사의 예에서는 js를 사용하여 목록 텍스트를 클릭하고 텍스트 줄의 배경색을 구현하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 세부 내용은 다음과 같습니다.
JS는 li를 제어하며 마우스를 클릭하면 클래스가 자동으로 추가되고 목록 텍스트에 대해 선호하는 배경색의 웹 페이지 특수 효과가 생성됩니다.

작동 효과 다이어그램은 다음과 같습니다.

<style type="text/css">
li{cursor:pointer;}
.cur{background:red;}
</style>
<script type="text/javascript">
window.onload = function ()
{
 var aLi = document.getElementsByTagName("li");
 var i = 0; 
 for (i = 0; i < aLi.length; i++)
 { 
 aLi[i].onclick = function ()
 {
  for (i = 0; i < aLi.length; i++) aLi[i].className = "";
  this.className = "cur";
 };
 }
};
</script>
<div class="clMenu">
  <ul>
    <li>1</li>
    <li>2</li>
    <li>4</li>
    <li>5</li>
  </ul>
</div>

이 기사가 모든 사람의 JavaScript 프로그래밍 설계에 도움이 되기를 바랍니다.