illustrer:
Cliquez sur un paragraphe de texte et modifiez le texte en rouge. Après avoir cliqué à nouveau, le texte reviendra en noir.
La copie de code est la suivante:
<! doctype html>
<html>
<adal>
<meta charset = "utf-8">
<Title> JQuery Test </Title>
<script src = "jQuery-1.11.1.min.js"> </ script>
<style type = "text / css">
.rouge
{
Couleur: rouge;
}
</ style>
</ head>
<body>
<p> L'apprentissage, c'est comme naviguer contre le courant, si vous ne progressez pas, vous vous retirerez </p>
<p> L'apprentissage, c'est comme naviguer contre le courant, si vous ne progressez pas, vous vous retirerez </p>
<p> L'apprentissage, c'est comme naviguer contre le courant, si vous ne progressez pas, vous vous retirerez </p>
<p> L'apprentissage, c'est comme naviguer contre le courant, si vous ne progressez pas, vous vous retirerez </p>
<script type = "text / javascript">
$ ("p"). Cliquez sur (fonction () {
if ($ (this) .hasclass ("red")) {// juger s'il a cette classe
$ (this) .removeclass ("rouge");
}autre{
$ (this) .addclass ("rouge");
}
})
</cript>
</docy>
</html>
Parce qu'il s'agit d'un processus d'alternance, vous pouvez utiliser la méthode ToggleClass. Si la classe correspondante: "rouge" existe, il sera supprimé. S'il n'existe pas, il sera ajouté.
La copie de code est la suivante:
<! doctype html>
<html>
<adal>
<meta charset = "utf-8">
<Title> JQuery Test </Title>
<script src = "jQuery-1.11.1.min.js"> </ script>
<style type = "text / css">
.rouge
{
Couleur: rouge;
}
</ style>
</ head>
<body>
<p> L'apprentissage, c'est comme naviguer contre le courant, si vous ne progressez pas, vous vous retirerez </p>
<p> L'apprentissage, c'est comme naviguer contre le courant, si vous ne progressez pas, vous vous retirerez </p>
<p> L'apprentissage, c'est comme naviguer contre le courant, si vous ne progressez pas, vous vous retirerez </p>
<p> L'apprentissage, c'est comme naviguer contre le courant, si vous ne progressez pas, vous vous retirerez </p>
<script type = "text / javascript">
$ ("p"). Cliquez sur (fonction () {
$ (this) .toggleclass ("rouge");
})
</cript>
</docy>
</html>