Maison >interface Web >js tutoriel >js cliquez sur le texte de la liste correspondant à la ligne affichant la couleur d'arrière-plan de mise en œuvre des compétences code_javascript

js cliquez sur le texte de la liste correspondant à la ligne affichant la couleur d'arrière-plan de mise en œuvre des compétences code_javascript

WBOY
WBOYoriginal
2016-05-16 15:47:001179parcourir

L'exemple de cet article décrit comment utiliser js pour cliquer sur le texte de la liste et réaliser la couleur d'arrière-plan de la ligne de texte. Partagez-le avec tout le monde pour votre référence. Les détails sont les suivants :
JS contrôle li, la classe est automatiquement ajoutée lorsque vous cliquez sur la souris et les effets spéciaux de la page Web de votre couleur d'arrière-plan préférée sont générés pour le texte de la liste.

Le diagramme d'effet de fonctionnement est le suivant :

<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>

J'espère que cet article sera utile à la conception de la programmation JavaScript de chacun.

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn