Jquery操作基本筛选过滤器
生活随笔
收集整理的這篇文章主要介紹了
Jquery操作基本筛选过滤器
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>層級選擇器</title><link rel="stylesheet" href="../../css/style.css" type="text/css"/><script type="text/javascript" src="../../js/jquery-1.8.3.js" ></script><script>$(function(){$("#btn1").click(function(){$("body div:first").css("background-color","red");})$("#btn2").click(function(){$("body div:last").css("background-color","red");})$("#btn3").click(function(){$("body div:odd").css("background-color","red");})$("#btn4").click(function(){$("body div:even").css("background-color","red");})});</script></head><body><input type="button" id="btn1" value="body中的第一個div元素"/><input type="button" id="btn2" value="body中的最后一個div元素"/><input type="button" id="btn3" value="選擇body中的奇數的div"/><input type="button" id="btn4" value="選擇body中的偶數的div"/><hr/><div id="one"><div class="mini">111</div></div><div id="two"><div class="mini">222</div><div class="mini">333</div></div><div id="three"><div class="mini">444</div><div class="mini">555</div><div class="mini">666</div></div><span id="four"></span></body>
</html>
style.css
body { font:12px/19px Arial, Helvetica, sans-serif; color:#666;} form div { margin:5px 0;} .int label { float:left; width:100px; text-align:right;} .int input { padding:1px 1px; border:1px solid #ccc;height:16px;} .sub { padding-left:100px;} .sub input { margin-right:10px; } .formtips{width: 200px;margin:2px;padding:2px;} .onError{background:#FFE0E9 url(../img/reg3.gif) no-repeat 0 center;padding-left:25px; } .onSuccess{background:#E9FBEB url(../img/reg4.gif) no-repeat 0 center;padding-left:25px; } .high{color:red; }div,span,p {width:140px;height:140px;margin:5px;background:#aaa;border:#000 1px solid;float:left;font-size:17px;font-family:Verdana;}div.mini { width:55px;height:55px;background-color: #aaa;font-size:12px;}div.hide { display:none;}table { border:0;border-collapse:collapse;} td { font:normal 12px/17px Arial;padding:2px;width:100px;} th { font:bold 12px/17px Arial;text-align:left;padding:4px;border-bottom:1px solid #333;} .even { background:#FFF38F;} /* 偶數行樣式*/ .odd { background:#FFFFEE;} /* 奇數行樣式*/ .selected { background:#FF6500;color:#fff;}?
轉載于:https://www.cnblogs.com/benjamin77/p/9162375.html
創作挑戰賽新人創作獎勵來咯,堅持創作打卡瓜分現金大獎總結
以上是生活随笔為你收集整理的Jquery操作基本筛选过滤器的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 刘花英为什么是巨魔(刘花英巨魔事件时间在
- 下一篇: 组件模块化使用