suchen

Heim  >  Artikel  >  Web-Frontend  >  Welche Methoden gibt es zum Bearbeiten von Elementstilen in JQuery?

Welche Methoden gibt es zum Bearbeiten von Elementstilen in JQuery?

青灯夜游
青灯夜游Original
2022-05-11 20:17:244023Durchsuche

Methoden zum Betreiben von Stilen: 1. css(), legt das Stilattribut des Elements fest; 2. height(), legt die Höhe des Elements fest; 4. scrollLeft (), legt die relative Position des Elements fest. Der Versatz zur linken Seite der Bildlaufleiste. 5. scrollTop(), legt den Versatz des Elements relativ zum oberen Rand der Bildlaufleiste fest Stil durch Steuern der ID-, Klassen- und Stilattribute des Elements; 7. prop(), Manipulieren von Stilen durch Steuern des Stils und anderer Attribute von Elementen.

Welche Methoden gibt es zum Bearbeiten von Elementstilen in JQuery?

Die Betriebsumgebung dieses Tutorials: Windows7-System, jquery1.10.2-Version, Dell G3-Computer.

jquery-Methode zum direkten Bedienen von Elementstilen

CSS-Eigenschaften Beschreibung
css() Legt die Stileigenschaften übereinstimmender Elemente fest oder gibt sie zurück.
height() Setzt die Höhe des passenden Elements oder gibt sie zurück.
offset() Gibt die Position des ersten übereinstimmenden Elements relativ zum Dokument zurück.
position() Gibt die Position des ersten passenden Elements relativ zum übergeordneten Element zurück.
scrollLeft() Legt den Versatz des passenden Elements relativ zur linken Seite der Bildlaufleiste fest oder gibt ihn zurück.
scrollTop() Legen Sie den Versatz des passenden Elements relativ zum oberen Rand der Bildlaufleiste fest oder geben Sie ihn zurück.
width() Legt die Breite des passenden Elements fest oder gibt sie zurück.

1. Syntax für CSS-Eigenschaftswerte: 

$(selector).css(name)

Höhensyntax festlegen : 

$(selector).css(name,value)

3. Width()

Syntax zum Zurückgeben der Breite: 

$(selector).height()

Syntax zum Festlegen der Breite: 

$(selector).height(length)

Beispiel: Elementstil manipulieren – Elementbreite ändern

1. Verwenden Sie die width()-Methode 

$(selector).width()

2. Verwenden Sie die CSS()-Methode

$(selector).width(length)

Welche Methoden gibt es zum Bearbeiten von Elementstilen in JQuery?jquery-Methode, um Elementstile indirekt zu bedienen.

In jquery können Sie indirekt durch die Bedienung von Elementattributen Elementstile bedienen.

Welche Methoden gibt es zum Bearbeiten von Elementstilen in JQuery?

Methode Beschreibung

addClass()

Fügt den angegebenen Klassennamen zum übereinstimmenden Element hinzu. attr()Legen Sie die Attribute und Werte des passenden Elements fest oder geben Sie sie zurück. prop()Setzen Sie das Attribut/den Wert des ausgewählten Elements ein oder geben Sie es zurück. removeAttr()Entfernen Sie das angegebene Attribut aus allen übereinstimmenden Elementen. removeClass()Entferne alle oder angegebene Klassen aus allen übereinstimmenden Elementen. toggleClass()Eine Klasse zum übereinstimmenden Element hinzufügen oder daraus entfernen. Wenn Sie die attr()-Methode verwenden, um das Stilattribut eines Elements festzulegen, können Sie dem Element CSS-Stile hinzufügen. 
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("img").width("200px");
				});
			});
		</script>
	</head>
	<body>

		<img  src="1.jpg"    style="max-width:90%"/ alt="Welche Methoden gibt es zum Bearbeiten von Elementstilen in JQuery?" ><br>
		<button>修改元素的宽度</button>
	</body>
</html>
【Empfohlenes Lernen: jQuery-Video-Tutorial,
Beispiel: Verwenden Sie attr(), um einen Stil hinzuzufügen.
Web-Front-End-Einführungsvideo

】

Das obige ist der detaillierte Inhalt vonWelche Methoden gibt es zum Bearbeiten von Elementstilen in JQuery?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

jquery css class position
Stellungnahme：
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
Vorheriger Artikel：So verbergen Sie das übergeordnete Element in jqueryNächster Artikel：So verbergen Sie das übergeordnete Element in jquery

In Verbindung stehende Artikel

Mehr sehen