Anwendungsbeispiele für Tag-Elementattribute, die von jQuery_jquery verwendet werden

Das Beispiel in diesem Artikel beschreibt die Verwendung von Tag-Elementattributen, die von jQuery verwendet werden. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Die hier vorgestellte Verwendung von jQuery umfasst hauptsächlich die Art und Weise, wie jQuery die Seite steuert, einschließlich Elementattribute, CSS-Stil, DOM-Modell, Formularelemente und Ereignisverarbeitung usw.

Attribute von Tag-Elementen

Jedes Tag in HTML hat einige Attribute und ihre Tags stellen verschiedene Zustände auf der Seite dar, wie zum Beispiel das folgende -Tag

Code kopieren Der Code lautet wie folgt:

Das Tag stellt den Namen des Tags dar, bei dem es sich um einen Hyperlink handelt. Darüber hinaus geben Attribute wie die href-Titelziel-ID die verschiedenen Status dieses Hyperlinks auf der Seite an.

In diesem Artikel wird die Methode zur Seitenattributsteuerung aus der Perspektive von jQuery näher erläutert.

1.each() durchläuft Elemente

Die Methode

each(callback) wird hauptsächlich zum Durchlaufen der Elemente im Selektor verwendet. Sie akzeptiert eine Funktion als Parameter. Diese Funktion akzeptiert einen Parameter, der sich auf die Seriennummer des Elements bezieht. Für markierte Attribute können Sie die Methode every() mit dem Schlüsselwort this verwenden, um den Attributwert für jedes Element im Selektor abzurufen oder festzulegen.

Verwenden Sie die Methode every(), um alle Elemente zu durchlaufen.

Code kopieren Der Code lautet wie folgt:

Erster Absatz

Zweiter Absatz

Zweiter Absatz

Zweiter Absatz

Zweiter Absatz

Zweiter Absatz

Zweiter Absatz

Der obige Code enthält 7 P-Elemente. Verwenden Sie zunächst $("p"), um die Menge aller p-Elemente auf der Seite zu erhalten, und verwenden Sie dann die Methode every(), um alle Bilder zu durchlaufen. Greifen Sie über das Schlüsselwort this auf das Bild zu, rufen Sie die ID des Bildes ab und legen Sie das ID-Attribut des Bildes fest. Der Funktionsindex der every()-Methode ist die Seriennummer des Elements.

2. Ermitteln Sie den Wert des Attributs. attr(name)-Methode

Außer beim Durchlaufen der Elemente im gesamten Selektor. Oft müssen Sie den Wert der Eigenschaften eines Objekts ermitteln. Dies kann einfach über die Methode attr(name) in jQuery erreicht werden. Diese Methode ruft den ersten Attributwert im Elementsatz ab. Wenn es keine Übereinstimmung gibt, geben Sie unfefined zurück.

Code kopieren Der Code lautet wie folgt:

script type="text/javascript">
$(function() {
var sTitle = $("p").attr("title");//Den Titelattributwert des ersten p-Elements abrufen
$("#display").text(sTitle);
});

Erster Absatz

Zweiter Absatz

Zweiter Absatz

Zweiter Absatz

Zweiter Absatz

Zweiter Absatz

Zweiter Absatz

Wenn Sie den Titelattributwert des zweiten p erhalten möchten, können Sie dies über die Positionsauswahl tun.

Code kopieren Der Code lautet wie folgt:

$(function() {
var sTitle = $("p:eq(1)").attr("title");//Den Titelattributwert des zweiten p-Elements abrufen
$("#display").text(sTitle);
});

3. Legen Sie den Wert des Attributs fest. attr(name,value) Zusätzlich zum Abrufen des Werts des Elements kann die Methode

attr() auch den Wert des Attributs festlegen. Der allgemeine Ausdruck lautet

Code kopieren Der Code lautet wie folgt:

attr(name,value)

Beispiel: Der folgende Code bewirkt, dass alle Hyperlinks auf der Seite in einem neuen Fenster geöffnet werden.

Code kopieren Der Code lautet wie folgt:

Beispiel:

Code kopieren Der Code lautet wie folgt:

Erster Button Zweiter Button Der dritte Button

Wenn beim Positionswähler auf die erste Schaltfläche geklickt wird, werden die folgenden beiden Schaltflächen gleichzeitig deaktiviert.

Oft hoffen wir, dass sich der Wert eines Attributs aufgrund verschiedener Elemente regelmäßig ändern kann. Zu diesem Zeitpunkt können wir attr (Name, Fn) verwenden, der zweite Parameter ist eine Funktion. Diese Funktion akzeptiert einen Parameter, nämlich die Seriennummer des Elements, und der Rückgabewert ist eine Zeichenfolge.

Code kopieren Der Code lautet wie folgt:

Element 0

Element 1

Punkt 2

Inhalt zurückgeben:

Code kopieren Der Code lautet wie folgt:Item 0 (id='div-id0') Element 1 (id='div-id1')

Element 2 (id='div-id2')

Der obige Code setzt den ID-Attributwert aller

-Blöcke auf der Seite über attr(name,fn) auf seriennummernbezogene Parameter. Und durchlaufen Sie den div-Block mit der Methode every(), um den ID-Wert im entsprechenden -Tag anzuzeigen. Dies zeigt die Leistungsfähigkeit der jQuery-Kette.

Manchmal möchten Sie für einige Elemente gleichzeitig unterschiedliche Attribute festlegen. Wenn Sie die oben beschriebene Methode verwenden, müssen Sie die Attribute einzeln festlegen. jQuery ist sehr benutzerfreundlich und attr() bietet auch eine Methode zur Listeneinstellung attr(properties). Es können mehrere Eigenschaften festgelegt werden.

Code kopieren Der Code lautet wie folgt:







Ausführungsergebnis:

Code kopieren Der Code lautet wie folgt:

4. Attribute löschen

Beim Festlegen des Werts eines Elementattributs kann der Attributwert über die Methode „removeAttr(name)“ gelöscht werden. Das Element wird dann auf seine Standardeinstellungen zurückgesetzt. Mit dem folgenden Code werden beispielsweise alle Schaltflächen deaktiviert.

Code kopieren Der Code lautet wie folgt:

$(function() {
$("button").removeAttr("disabled")
});

Das Löschen des Attributs „removeAttr(name)“ entspricht dem Nichtlöschen des Attributs im HTML-Tag. Dies bedeutet nicht, dass dieses Merkmal der Marke beseitigt wurde. Nachdem der obige Code ausgeführt wurde, können alle Schaltflächen weiterhin deaktiviert werden.

Ich hoffe, dass dieser Artikel für alle bei der jQuery-Programmierung hilfreich sein wird.

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn