jQuery implementiert Funktionen zum Reduzieren und Erweitern von Artikeln
|
Dieses Artikelbeispiel teilt den spezifischen Code von jQuery, um die Funktionen zum Reduzieren und Erweitern des Artikels zu Ihrer Information zu realisieren. Der spezifische Inhalt ist wie folgt Kommen wir ohne weitere Umschweife direkt zum Code
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<title>Artikel</title>
</Kopf>
<Text>
<div>
<p>Artikel-Ein- und Ausblendfunktion</p>
<div Klasse="Artikel">
<div>
<div style="color: #409EFF;">Überschreitet die Wortgrenze</div>
<span class="Artikel">
MQTT ist ein leichtes, proxybasiertes Publish/Subscribe-Nachrichtenübertragungsprotokoll, das offen, einfach, leicht und leicht zu implementieren ist.
Diese Funktionen machen es für den Einsatz in eingeschränkten Umgebungen geeignet. Netzwerke sind teuer, haben eine geringe Bandbreite und sind unzuverlässig.
Läuft auf eingebetteten Geräten mit begrenzten Prozessor- und Speicherressourcen. Die Merkmale dieser Vereinbarung sind:
Verwenden Sie das Publish/Subscribe-Messaging-Modell, um die Veröffentlichung von Eins-zu-vielen-Nachrichten zu ermöglichen und Anwendungen zu entkoppeln.
Nachrichtenübertragung mit abgeschirmtem Nutzlastinhalt.
Bietet Netzwerkkonnektivität über TCP/IP.
</span>
<span class="siehe" style="Farbe: #409EFF;"></span>
</div>
</div>
<br />
<div Klasse="Artikel">
<div>
<div style="color: #409EFF;">Überschreitet nicht die Wortanzahl</div>
<span class="article">ABCDEFGHIJKLNMOPQRSTUVWXYZ</span>
<span class="siehe" style="Farbe: #409EFF;"></span>
</div>
</div>
<br />
<div Klasse="Artikel">
<div>
<div style="color: #409EFF;">Überschreitet die Wortgrenze</div>
<span class="Artikel">
Die Richtigkeit des MOS wirkt sich direkt auf die normale Verwendung der Festplatte aus und bezieht sich hauptsächlich auf den Festplattentyp.
Glücklicherweise unterstützen alle aktuellen Maschinen die Funktion „IDE Auto Detect“, die den Festplattentyp automatisch erkennen kann.
Wenn Sie eine neue Festplatte anschließen oder die Festplatte durch eine neue ersetzen, müssen Sie mit dieser Funktion den Typ zurücksetzen.
Natürlich können einige Motherboard-Typen den Festplattentyp mittlerweile automatisch erkennen.
Wenn der Festplattentyp falsch ist, kann das System manchmal überhaupt nicht gestartet werden. Manchmal lässt es sich zwar starten, es treten jedoch Lese- und Schreibfehler auf.
</span>
<span class="siehe" style="Farbe: #409EFF;"></span>
</div>
</div>
</div>
</body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<Skripttyp="text/javascript">
$(Dokument).bereit(Funktion(){
//Den aktuellen Status des Artikels aufzeichnen var onoff = false;
//Verwenden Sie $().each, um jeden Artikel zu durchlaufen und festzulegen$('.item').each(function() {
//Verwenden Sie $(this).find(), um das aktuelle Artikel-DOM abzurufen
var Artikel = $(this).find('.article');
//Artikelinhalt abrufen var str = article.text();
//Verwenden Sie $(this).find(), um das erweiterte und reduzierte DOM abzurufen
var siehe = $(this).find('.see');
//Wenn der Artikel mehr als 50 Wörter hat, werden nur die ersten 50 Wörter angezeigt if (str.length > 50) {
Artikel.Text(str.substr(0, 50) + '......');
see.text('[Ansicht]'); //Den Ansichtsbutton am Ende des Artikels anzeigen}
//Button-Listener festlegen see.click(function() {
wenn (anaus) {
Artikel.Text(str.substr(0, 50) + '......');
siehe.text('[Ansicht]');
} anders {
Artikel.text(str);
siehe.text('[Bearbeiten]');
}
anaus = !anaus
});
});
});
</Skript>
</html>
Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: So konfigurieren Sie Bash-Umgebungsvariablen in Linux
Artikel empfehlen
Detaillierte Erläuterung der Verwendung von var () von CSS3 zum Ändern von SCSS-Variablenwerten zur Laufzeit
var() Einführung und Verwendung Details (MDN) IE ...
Das ganz links stehende Übereinstimmungsprinzip des MySQL-Datenbankindex
Inhaltsverzeichnis 1. Gemeinsame Indexbeschreibun...
Die 6 effektivsten Möglichkeiten zum Schreiben von HTML und CSS
In diesem Artikel werden die sechs wirksamsten Me...
Detaillierte Methode zur Verwendung von GoAccess zum Analysieren von Nginx-Protokollen
Vor kurzem wollte ich Goaccess verwenden, um Ngin...
So deaktivieren Sie Anzeigen in der Terminal-Willkommensnachricht in Ubuntu Server
Wenn Sie die neueste Ubuntu Server-Version verwen...
JavaScript implementiert die umfassendste Codeanalyse einer einfachen Lupe (ES5)
In diesem Artikel wird der spezifische Code von J...
Zusammenfassung des fragmentierten Wissens zum Docker-Management
Inhaltsverzeichnis 1. Übersicht 2. Anwendungsbeis...
Detaillierte Erläuterung des vollständigen Anwendungsbeispiels zur Entwicklung von Hyperf unter Docker
Offizielle Hyperf-Website Hyperf offizielle Dokum...
Detaillierte Erklärung der KeepAlive-Verwendung in der Vue-Frontend-Entwicklung
Inhaltsverzeichnis Vorwort Keep-Avlive-Hook-Funkt...
Detaillierte Erläuterung der Nginx-Strombegrenzungskonfiguration
Dieser Artikel erläutert anhand von Beispielen di...
Eine allgemeine Methode zur Implementierung eines unendlichen Textkarussells mit nativem CSS
Textkarussells sind in unserem täglichen Leben we...
Detailliertes Tutorial zum Abrufen der Oracle 11g-Imagekonfiguration über Docker
Ohne weitere Umschweife Beginnen Sie mit der Aufz...
Eine sehr detaillierte Erklärung des Linux DHCP-Dienstes
Inhaltsverzeichnis 1. DHCP-Dienst (Dynamic Host C...
Werfen wir einen Blick auf die Vorkompilierung von JavaScript (Zusammenfassung)
JS-Lauftrilogie js-Ausführungscode ist in drei Sc...
Natives js zum Erzielen eines Akkordeoneffekts
Auch bei der tatsächlichen Entwicklung von Websei...