Bagaimana untuk mengalih keluar bahagian gaya jquery-Soal Jawab bahagian hadapan-php.cn

Bagaimana untuk mengalih keluar bahagian gaya jquery

青灯夜游

Lepaskan： 2022-09-09 19:05:34

asal

5599 orang telah melayarinya

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();".

Bagaimana untuk mengalih keluar bahagian gaya jquery

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)

Salin selepas log masuk

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>

Salin selepas log masuk

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>

Salin selepas log masuk

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!