Rumah >hujung hadapan web >Soal Jawab bahagian hadapan >Bagaimana untuk mengalih keluar bahagian gaya jquery

Bagaimana untuk mengalih keluar bahagian gaya jquery

青灯夜游asal: 2022-09-09 19:05:345637semak imbas

Dua kaedah untuk mengalih keluar gaya: 1. Gunakan fungsi removeAttr() untuk mengalih keluar gaya yang ditetapkan oleh atribut gaya, sintaksnya ialah "$(selector).removeAttr("style");". 2. Gunakan fungsi empty() untuk mengosongkan kandungan teg gaya dan mengalih keluar gaya teg gaya Sintaks ialah "$("style").empty();".

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

Dalam HTML, gaya gaya terbahagi kepada dua situasi:

1 Gaya yang termasuk dalam atribut gaya

Atribut gaya ialah teras atribut HTML. Gunakan Untuk menentukan gaya sebaris untuk elemen. Atribut gaya

akan mengatasi gaya global lain, seperti yang ditakrifkan dalam elemen
2. Gaya yang terkandung dalam teg gaya

teg gaya mentakrifkan maklumat gaya dokumen HTML.

Dalam elemen gaya, anda boleh menentukan cara dokumen HTML dipaparkan dalam penyemak imbas.

JQuery mempunyai kaedah pengalihan keluar yang berbeza untuk situasi yang berbeza.

1. Gunakan kaedah jquery removeAttr() untuk mengalih keluar atribut gaya

Kaedah removeAttr() digunakan untuk mengalih keluar atribut daripada elemen yang dipilih.

Sintaks:

$(selector).removeAttr(attribute)

atribut: diperlukan. Menentukan atribut untuk dialih keluar daripada elemen yang ditentukan.

Contoh: Alih keluar atribut gaya bagi elemen p pertama

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-3.6.1.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("p:first").removeAttr("style");
				});
			});
		</script>

	</head>

	<body>
		<h1>这是一个大标题</h1>
		<p style="font-size: 120%;color: blue;background-color: yellow;">这是一个段落。</p>
		<p style="font-size: 120%;color: blue;background-color: yellow;">这是另一个段落。</p>
		<button>移除第一个 p 元素的style属性</button>
	</body>

</html>

Bagaimana untuk mengalih keluar bahagian gaya jquery

2. Gunakan kaedah jquery empty() untuk mengosongkan style Kandungan tag

kaedah kosong() mengalih keluar semua nod anak dan kandungan elemen yang dipilih, tetapi tidak memadamkan elemen yang dipilih.

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-3.6.1.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("style").empty();
				});
			});
		</script>
		<style>
			h1{
				color: coral;
			}
			p{
				font-size: 120%;
				color: blue;
				background-color: yellow;
			}
		</style>
	</head>

	<body>
		<h1>这是一个大标题</h1>
		<p>这是一个段落。</p>
		<p>这是另一个段落。</p>
		<button>清空style标签样式</button>
	</body>

</html>

Bagaimana untuk mengalih keluar bahagian gaya jquery

[Pembelajaran yang disyorkan: tutorial video jQuery, video pembangunan bahagian hadapan web]

Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar bahagian gaya jquery. 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：Bolehkah jquery mendapatkan kandungan pautan?Artikel seterusnya：Bolehkah jquery mendapatkan kandungan pautan?

Artikel berkaitan

Lihat lagi