Heim > Artikel > Web-Frontend > Kann JQuery CSS-Stile hinzufügen?

Kann JQuery CSS-Stile hinzufügen?

青灯夜游Original: 2022-03-16 18:47:394167Durchsuche

jquery kann einen CSS-Stil hinzufügen. Methode: 1. Verwenden Sie css(), um das Stilattribut des passenden Elements festzulegen. Die Syntax lautet „$(selector).css (attribute name, attribute value)“; ) lautet die Syntax „$(selector).attr(“style“,“style code“)“.

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

jquery kann CSS-Stile hinzufügen Sie können beispielsweise die Methode css() verwenden, um CSS-Stile hinzuzufügen, oder die Methode attr() verwenden, um CSS-Inline-Stile hinzuzufügen, indem Sie das Stilattribut festlegen.

jquery-Methode zum Hinzufügen eines CSS-Stils

1. Verwenden Sie die Methode css()

css(), um ein oder mehrere Stilattribute des passenden Elements zurückzugeben oder festzulegen.

Syntax zum Festlegen von CSS-Stilen

$(selector).css(name,value)

Parameter	Beschreibung
Name	Erforderlich. Gibt den Namen der CSS-Eigenschaft an. Dieser Parameter kann eine beliebige CSS-Eigenschaft enthalten, beispielsweise „color“.
Wert	Optional. Gibt den Wert einer CSS-Eigenschaft an. Dieser Parameter kann einen beliebigen CSS-Eigenschaftswert enthalten, beispielsweise „red“. Wenn der leere Zeichenfolgenwert festgelegt ist, wird das angegebene Attribut aus dem Element entfernt.

Parameter

Beschreibung

Name

Erforderlich. Gibt den Namen der CSS-Eigenschaft an. Dieser Parameter kann eine beliebige CSS-Eigenschaft enthalten, beispielsweise „color“.

Wert

Optional. Gibt den Wert einer CSS-Eigenschaft an. Dieser Parameter kann einen beliebigen CSS-Eigenschaftswert enthalten, beispielsweise „red“.

Wenn der leere Zeichenfolgenwert festgelegt ist, wird das angegebene Attribut aus dem Element entfernt.

Beispiel:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/jquery-1.10.2.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("p").css("color", "red");
				});
			});
		</script>
	</head>

	<body>
		<p>这是一个段落</p>
		<p>这是另一个段落</p>
		<button>改变段落的颜色</button>
	</body>
</html>

Kann JQuery CSS-Stile hinzufügen?

2. Verwenden Sie die Methode attr()

attr(), um den Attributwert des ausgewählten Elements festzulegen oder zurückzugeben.

Wenn Sie die Methode attr() 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() {
					// $("div").attr({"style":"border: 5px solid paleturquoise;"});
					$("div").attr("style", "border: 5px solid paleturquoise;width: 200px;");
				});
			});
		</script>
	</head>
	<body>

		<div>hello</div>
		<br>
		<button>给div元素添加css样式</button>

	</body>
</html>

Kann JQuery CSS-Stile hinzufügen?

【Empfohlenes Lernen: jQuery-Video-Tutorial, Web-Frontend-Einführungsvideo】

Das obige ist der detaillierte Inhalt vonKann JQuery CSS-Stile hinzufügen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

jquery css 字符串

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 ermitteln Sie, ob Objekte in jquery gleich sindNächster Artikel：So ermitteln Sie, ob Objekte in jquery gleich sind

In Verbindung stehende Artikel

Mehr sehen