So ändern Sie die Elementbreite in JQuery (Breite)-Front-End-Fragen und Antworten-php.cn

So ändern Sie die Elementbreite in JQuery (Breite)

青灯夜游

Freigeben： 2022-05-16 18:25:37

Original

5730 Leute haben es durchsucht

Methoden zum Ändern der Elementbreite (width): 1. Verwenden Sie width(), um den Breitenwert direkt festzulegen. Die Syntax lautet „$(selector).width(„width value“)“ 2. Verwenden Sie css(), um Fügen Sie einen neuen Breitenstil hinzu. Die Syntax lautet „$(selector).css(„width“, „width value“)“.

So ändern Sie die Elementbreite in JQuery (Breite)

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

jquery zum Ändern der Elementbreite (width)

1. Verwenden Sie die width()-Methode

width()-Methode, um die Breite des passenden Elements zurückzugeben oder festzulegen.

<!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="So ändern Sie die Elementbreite in JQuery (Breite)" ><br>
		<button>修改元素的宽度</button>
	</body>
</html>

Nach dem Login kopieren

So ändern Sie die Elementbreite in JQuery (Breite)

2. Verwenden Sie die css()-Methode

<!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").css("width","250px");
				});
			});
		</script>
	</head>
	<body>

		<img  src="1.jpg"    style="max-width:90%"/ alt="So ändern Sie die Elementbreite in JQuery (Breite)" ><br>
		<button>修改元素的宽度</button>
	</body>
</html>

Nach dem Login kopieren

So ändern Sie die Elementbreite in JQuery (Breite)

[Empfohlenes Lernen: jQuery-Video-Tutorial, Web-Frontend-Video]

Das obige ist der detaillierte Inhalt vonSo ändern Sie die Elementbreite in JQuery (Breite). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!