Rumah > Artikel > hujung hadapan web > Bolehkah jquery mendapatkan elemen sebelumnya?

Bolehkah jquery mendapatkan elemen sebelumnya?

青灯夜游asal: 2022-09-13 17:30:403495semak imbas

jquery boleh mendapatkan elemen peringkat atas. Mendapatkan langkah: 1. Gunakan pemilih jQuery untuk memilih elemen yang ditentukan Sintaks "$("pemilih")" akan mengembalikan objek jQuery yang mengandungi elemen yang ditentukan 2. Gunakan fungsi induk() untuk mendapatkan elemen induk langsung elemen yang ditentukan ( Elemen sebelumnya), sintaksnya ialah "objek.ibu bapa(penapis)", dan parameter "penapis" digunakan untuk mengecilkan skop carian.

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 3.6.1, komputer Dell G3.

Mendapatkan elemen peringkat atas ialah mendapatkan elemen induk. Dalam jquery, anda boleh menggunakan fungsi parent() untuk mendapatkan elemen induk.

Langkah pelaksanaan

Langkah 1: Gunakan pemilih jQuery untuk memilih elemen yang ditentukan

1) pemilih elemen jQuery adalah berdasarkan elemen Nama elemen yang dipilih.

$("标签名")

2) Pemilih id jQuery memilih elemen berdasarkan atribut id.

$("#id属性值")
<form id="属性值">
//表单元素
</form>

akan mengembalikan objek jQuery yang mengandungi elemen yang ditentukan.

Langkah 2: Gunakan fungsi parent() untuk mendapatkan elemen induk bagi elemen yang ditentukan

parent() mengembalikan elemen induk langsung bagi elemen yang dipilih. Kaedah ini hanya merentasi satu peringkat ke atas pokok DOM.

指定对象.parent(filter)

参数	描述
filter	可选。规定缩小搜索父元素范围的选择器表达式。

Contoh 1: Kembalikan elemen induk bagi elemen Contoh 2: Gunakan parameter penapis untuk mengecilkan skop carian

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-3.6.1.min.js"></script>
		<script>
			$(document).ready(function() {
				 $("span").parent("li").css({"color":"red","border":"2px solid red"});
			});
		</script>
		<style>
			.ancestors * {
				display: block;
				border: 2px solid lightgrey;
				color: lightgrey;
				padding: 5px;
				margin: 15px;
			}
		</style>
	</head>

	<body class="ancestors">body (曾曾祖父节点)
		<div style="width:500px;">div (曾祖父节点)
			<ul>ul (祖父节点)
				<li>li (直接父节点，上一级元素)
					<span>span</span>
				</li>
				<li>li (直接父节点，上一级元素)
					<span>span</span>
				</li>
			</ul>
		</div>
	</body>

</html>

Bolehkah jquery mendapatkan elemen sebelumnya?

[Pembelajaran yang disyorkan: tutorial video jQuery

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-3.6.1.min.js"></script>
		<script>
			$(document).ready(function() {
				$("span").parent("li.1").css({"color":"red","border":"2px solid red"});
			});
		</script>
		<style>
			.ancestors * {
				display: block;
				border: 2px solid lightgrey;
				color: lightgrey;
				padding: 5px;
				margin: 15px;
			}
		</style>
	</head>

	<body class="ancestors">body (曾曾祖父节点)
		<div style="width:500px;">div (曾祖父节点)
			<ul>ul (祖父节点)  
				<li class="1">li (直接父节点)
					<span>span</span>
				</li>
				<li class="2">li (直接父节点)
					<span>span</span>
				</li>
			</ul>   
		</div>
	</body>
	
	</html>

video bahagian hadapan web

】 Bolehkah jquery mendapatkan elemen sebelumnya?

Atas ialah kandungan terperinci Bolehkah jquery mendapatkan elemen sebelumnya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：Apakah maksud saiz fon lalai css?Artikel seterusnya：Apakah maksud saiz fon lalai css?

Artikel berkaitan

Lihat lagi