Heim  >  Artikel  >  Web-Frontend  >  So fragen Sie das vorherige Element mit jquery ab

So fragen Sie das vorherige Element mit jquery ab

青灯夜游
青灯夜游Original
2022-03-16 15:51:176008Durchsuche

In jquery können Sie die prev()-Methode verwenden, um das vorherige Element eines bestimmten Elements abzufragen. Diese Methode kann das vorherige Geschwisterelement des ausgewählten Elements zurückgeben. Die Syntax lautet „$(selector).prev(filter)“. ; „filter“ ist ein optionaler Parameter, der den Suchbereich nach dem vorherigen Geschwisterelement einschränken kann.

So fragen Sie das vorherige Element mit jquery ab

Die Betriebsumgebung dieses Tutorials: Windows7-System, JQuery3.2.1-Version, Dell G3-Computer.

In jquery können Sie die prev()-Methode verwenden, um das vorherige Element eines angegebenen Elements abzufragen. Die Methode

prev() gibt das vorherige Geschwisterelement des ausgewählten Elements zurück.

Geschwisterelemente sind Elemente, die dasselbe übergeordnete Element haben.

Hinweis: Diese Methode gibt nur ein Element zurück.

Syntax:

$(selector).prev(filter)

Parameterfilter: Optional, gibt einen Selektorausdruck an, der den Suchbereich für das vorherige Geschwisterelement einschränkt.

Beispiel 1: Geben Sie das vorherige Geschwisterelement jedes

  • -Elements mit dem Klassennamen „start“ zurück:

  • <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8" />
    		<style>
    			.siblings * {
    				display: block;
    				border: 2px solid lightgrey;
    				color: lightgrey;
    				padding: 5px;
    				margin: 15px;
    			}
    		</style>
    		<script src="js/jquery-3.2.1.min.js"></script>
    		<script>
    			$(document).ready(function() {
    				$("li.start").prev().css({
    					"color": "red",
    					"border": "2px solid red"
    				});
    			});
    		</script>
    	</head>
    	<body>
    		<div style="width:500px;" class="siblings">
    			<ul>ul (父节点)
    				<li>li (兄弟节点)</li>
    				<li>li (类名为"start"的li节点的上一个兄弟节点)</li>
    				<li class="start">li (类名为"start"的li节点)</li>
    				<li>li (兄弟节点)</li>
    				<li>li (兄弟节点)</li>
    			</ul>
    		</div>
    	</body>
    </html>

    So fragen Sie das vorherige Element mit jquery ab

    Beispiel 2: Wählen Sie das vorherige Geschwisterelement jedes

    -Elements aus element
    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8" />
    		<script src="js/jquery-3.2.1.min.js"></script>
    		<script>
    			$(document).ready(function() {
    				$("div").prev().css("background-color", "yellow");
    			});
    		</script>
    	</head>
    	<body>
    
    		<p>这是一个P元素。</p>
    		<h2>这是一个标题,并且是div元素的上一个兄弟元素</h2>
    		<div style="border:1px solid black;padding:10px;">这是一个div元素。</div>
    		<p>这是另一个P元素。</p>
    		<p>这是一个P元素,并且是div元素的上一个兄弟元素。</p>
    		<div style="border:1px solid black;padding:10px;">
    			<p>这是div里面的一个P元素。</p>
    		</div>
    
    	</body>
    </html>

    So fragen Sie das vorherige Element mit jquery ab

    【Empfohlenes Lernen: jQuery-Video-Tutorial, Web-Front-End-Entwicklungsvideo

    Das obige ist der detaillierte Inhalt vonSo fragen Sie das vorherige Element mit jquery ab. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

    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