Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk meningkatkan warna latar belakang nilai jquery ul li

Bagaimana untuk meningkatkan warna latar belakang nilai jquery ul li

青灯夜游
青灯夜游asal
2022-05-23 13:46:182631semak imbas

Dua kaedah: 1. Gunakan css() untuk menetapkan atribut latar belakang, sintaksnya ialah "$("ul li").css("latar belakang","nilai warna")". 2. Gunakan attr() untuk menambah gaya latar belakang, sintaksnya ialah "$("ul li").attr("style","background:color value")".

Bagaimana untuk meningkatkan warna latar belakang nilai jquery ul li

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

Dua cara untuk meningkatkan warna latar belakang dengan nilai jquery ul li:

1 Gunakan css()

Kaedah css() mengembalikan atau menetapkan satu atau lebih atribut gaya elemen yang dipadankan.

Anda hanya perlu menambah atribut latar belakang (warna latar belakang atau latar belakang) pada elemen ul li dan tetapkan nilai warna.

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(function () {
            $("button").click(function () {
                $("ul li").css("background","red");
            })
        })
    </script>
	</head>
	<body>
		<ul>
			<li>第1个li元素</li>
			<li>第2个li元素</li>
			<li>第3个li元素</li>
			<li>第4个li元素</li>
			<li>第5个li元素</li>
			<li>第6个li元素</li>
		</ul>
		<button>ul li值增加背景颜色</button>
	</body>
</html>

Bagaimana untuk meningkatkan warna latar belakang nilai jquery ul li

2. Gunakan kaedah attr()

attr() untuk menetapkan atau mengembalikan nilai atribut bagi elemen yang dipilih.

Anda hanya perlu menetapkan atribut gaya kepada elemen ul li untuk menambah gaya latar belakang.

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(function () {
            $("button").click(function () {
                $("ul li").attr("style","background:pink");
            })
        })
    </script>
	</head>
	<body>
		<ul>
			<li>第1个li元素</li>
			<li>第2个li元素</li>
			<li>第3个li元素</li>
			<li>第4个li元素</li>
			<li>第5个li元素</li>
			<li>第6个li元素</li>
		</ul>
		<button>ul li值增加背景颜色</button>
	</body>
</html>

Bagaimana untuk meningkatkan warna latar belakang nilai jquery ul li

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

Atas ialah kandungan terperinci Bagaimana untuk meningkatkan warna latar belakang nilai jquery ul li. 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