Das Beispiel in diesem Artikel beschreibt, wie der JQuery-Ein- und Ausblendeffekt implementiert wird. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Früher gab es einige Missverständnisse, weil man dachte, dass das Ein- und Ausblenden das Löschen des Elements bedeute, aber in Wirklichkeit wird das Element nur ausgeblendet und angezeigt.
Der spezifische Code lautet wie folgt:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh" dir="ltr">
<head>
<mce:script type="text/javascript" src="jquery-1.4.4.min.js" mce_src="jquery-1.4.4.min.js"></mce:script>
<title>Example | xHTML1.0</title>
</head>
<body>
<button id="click">click</button>
<ul id="ul">
<li>#</li>
<li>@</li>
<li>$</li>
</ul>
<mce:script type="text/javascript"><!--
$(function () {
var _num = 1;
$("#click").click(function () {
var _ul = $("#ul");
var _li = $("#ul li");
var _len = _li.length;
var _str = "<li style="display:none" mce_style="display:none">" + _num + "</li>";
_li.eq(_len-1).fadeOut('slow',function () {
$(this).remove();
});
++_num;
$(_str).prependTo(_ul).fadeIn('slow');
});
});
// --></mce:script>
</body>
</html>
Leser, die an weiteren Inhalten zu jQuery-Spezialeffekten interessiert sind, können sich das Spezialthema dieser Website ansehen: „Zusammenfassung gängiger klassischer Spezialeffekte in jQuery“
Ich hoffe, dass dieser Artikel allen in der jQuery-Programmierung hilfreich sein wird.
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
