开发工具与关键技术：DW
作者：冯超
撰写时间：2019年2月14日
first()表示第1个元素
last()表示最后一个元素
eq(num)表示第几个元素
代码如下，
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>筛选器</title>
<script src="../jquery-1.12.4/jquery-1.12.4.min.js"></script>
</head>
<body>
<script>
$(function(){
$("#b1").click(function(){
$("div").first().toggleClass("pink");
});
$("#b2").click(function(){
$("div").last().toggleClass("pink");
});
$("#b3").click(function(){
$("div").eq(1).toggleClass("pink");
});
});
</script>
<button id="b1">切换第1个div背景色</button>
<button id="b2">切换最后1个div背景色</button>
<button id="b3">切换第2个div背景色</button>
<br>
<style>
.pink{
background-color:pink;
}
</style>
<div>
<span>1</span>
</div>
<div >
<span>2</span>
</div>
<div >
<span>3</span>
</div>
</body>
</html>
点击第一个按钮会切换第一个div颜色，如图
点击第二个按钮会切换最后一个div颜色，如图
点击第三个按钮会切换第二个div颜色，如图
再点击一次的话就会切换回来
1543
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
