Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Bagaimana untuk mengosongkan lebar elemen dalam jquery

Bagaimana untuk mengosongkan lebar elemen dalam jquery

青灯夜游
Lepaskan: 2022-11-02 19:58:10
asal
1864 orang telah melayarinya

3 kaedah: 1. Gunakan width() untuk menetapkan lebar kepada 0, sintaks "$("specified element").width("0");" 2. Gunakan css() untuk menetapkan atribut lebar Nilai lebar ditetapkan kepada 0, sintaks ialah "$("elemen yang ditentukan").css("lebar","0");" 3. Gunakan attr() untuk menetapkan nilai lebar kepada 0, sintaks ialah "$("elemen yang ditentukan ").attr("style","width:0");".

Bagaimana untuk mengosongkan lebar elemen dalam jquery

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

Kosongkan lebar (lebar) elemen, iaitu mengosongkan atribut lebar (gaya) elemen (tetapkan nilai atribut kepada 0).

3 cara mengosongkan lebar elemen (lebar) dengan jquery

1. Gunakan width() untuk menetapkan lebar kepada 0

width() mengembalikan atau menetapkan lebar elemen padanan.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/jquery-3.6.1.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("#box").width("0");
				});
			});
		</script>
		<style>
			p{
				width: 100px;
				height: 20px;
				border: 1px solid red;
				overflow: hidden;
			}
		</style>
	</head>
	<body>

		<p>一个段落</p>
		<p id="box">一个段落</p>
		<br><br><br>
		<button>清除元素的宽度</button>
	</body>
</html>
Salin selepas log masuk

Bagaimana untuk mengosongkan lebar elemen dalam jquery

2 Gunakan css() untuk menetapkan nilai atribut lebar kepada 0

kaedah css() boleh ditetapkan Satu atau lebih atribut gaya bagi elemen yang dipilih.

Sintaks:

Parameter Penerangan
namaDiperlukan. Menentukan nama sifat CSS. Parameter ini boleh mengandungi sebarang sifat CSS, seperti "warna".
nilai
$(selector).css(name,value)
Salin selepas log masuk
Pilihan. Menentukan nilai sifat CSS. Parameter ini boleh mengandungi sebarang nilai sifat CSS, seperti "merah".
参数描述
name必需。规定 CSS 属性的名称。该参数可包含任何 CSS 属性,比如 "color"。
value

可选。规定 CSS 属性的值。该参数可包含任何 CSS 属性值,比如 "red"。

如果设置了空字符串值,则从元素中删除指定属性。

Jika nilai rentetan kosong ditetapkan, alih keluar atribut yang ditentukan daripada elemen.

Hanya tetapkan nama kepada "lebar" dan nilai kepada "0".

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/jquery-3.6.0.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("p").css("width","0");
				});
			});
		</script>
		<style>
			p{
				width: 100px;
				height: 20px;
				border: 1px solid red;
				overflow: hidden;
			}
		</style>
	</head>
	<body>

		<p>一个段落</p>
		<p>一个段落</p>
		<br>
		<button>清除元素的宽度</button>
	</body>
</html>
Salin selepas log masuk
Contoh:

Bagaimana untuk mengosongkan lebar elemen dalam jquery

Kaedah 3: Gunakan attr() untuk menetapkan nilai lebar kepada 0
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/jquery-3.6.0.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("p").attr("style","width:0");
				});
			});
		</script>
		<style>
			p{
				width: 100px;
				height: 20px;
				border: 1px solid red;
				overflow: hidden;
			}
		</style>
	</head>
	<body>

		<p>一个段落</p>
		<br>
		<button>清除元素的宽度</button>
	</body>
</html>
Salin selepas log masuk

Bagaimana untuk mengosongkan lebar elemen dalam jquery

[Pembelajaran yang disyorkan: tutorial video jQuery,

video bahagian hadapan web]

Atas ialah kandungan terperinci Bagaimana untuk mengosongkan lebar elemen dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan