Beispiel für eine JQuery-Klassenauswahl

Der JQuery-Klassenselektor wählt Elemente anhand ihres Klassennamens aus. Es stellt die Elemente mit dem angegebenen Klassennamen dar. Es prüft und manipuliert die ihm zugeordneten Elemente. Es enthält das Klassenattribut eines Elements. Es ist auch möglich, mithilfe des Klassenattributs Stile für Elemente festzulegen. Ein Element kann mehrere Klassen enthalten. Wenn Sie mehreren HTML-Elementen einen Stil verleihen möchten, geben Sie einen bestimmten Klassennamen an, der diese Elemente enthält. Eine Klasse darf nicht mit Zahlen, Sonderzeichen usw. beginnen. Sie muss mit einem Punkt (.) beginnen.

Syntax der JQuery-Klassenauswahl

$(“.class”);

Der Parameter „Klasse“ ist ein erforderlicher Parameter, der alle Elemente mit dem angegebenen Klassennamen auswählt.

Beispiel für eine JQuery-Klassenauswahl

<!doctype html>
<head>
<title>JQuery Class Selector</title>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<h2>JQuery Class Selector Example</h2>
<style>
   h3.myclass{
      border-style:groove;
      border-width:4px;
   }
</style>
<script type="text/javascript">
   $(document).ready(function(){
      $(".myclass").css("color", "green");
   });
</script>
<body>
   <h3  >Hello world!!!</p>
   <h3>jQuery is a JavaScript Library.</p>
   <h3  >It is easy to learn. The jQuery simplifies JavaScript programming.</p>
</body>
</html>
  • Wie im obigen Programm gezeigt, haben wir den Code in $(document).ready verwendet, bei dem es sich um ein Ereignis handelt, das ausgelöst wird, wenn das Dokument bereit ist. Es wird ausgeführt, sobald das Seitendokumentobjektmodell für die Ausführung von JavaScript-Code bereit ist.
  • $(„.myclass“).css(„color“, „green“); Zeile definiert den Klassenselektor, der alle Elemente mit dem spezifischen Klassennamen iemyclass im Dokument auswählt. Es verwendet die CSS-Farbeigenschaft, die den Text in grüner Farbe anzeigt.
  • Wenn wir das obige Skript ausführen, wählt der Klassenselektor alle Elemente mit dem angegebenen Klassennamen aus und die Anweisungen werden mit dem gerillten Rahmenstil, der Rahmenbreite von 4 Pixeln und der grünen Farbe angezeigt, die unter dem Body-Tag definiert sind.

Demo zur JQuery-Klassenauswahl

Wenn Sie das obige Beispiel ausführen, erhalten Sie die folgende Ausgabe:

  • Führen Sie die JQuery-Klassenauswahl-Demo aus

Beispiel für eine JQuery-Klassenauswahl

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Nach oben scrollen