jq获取最后一个子元素的方法(post和get请求的区别面试)
核心提示:<!DOCTYPE html> <html> <head> <title>层次选择器</title> <meta http-equiv=”content-type” content=”text/html; charset=UTF
<!DOCTYPE html> <html> <head> <title>层次选择器</title> <meta http-equiv=”content-type” content=”text/html; charset=UTF-8″> <script type=”text/javascript” src=https://www.xinb2b.cn/aimg/bk45/4njskuvlgf2sard8ih095ohva0i2v6n6211j8qh3-0.jpg <style type=”text/css”> body{ font-family: “Microsoft YaHei” } .divCls { width:180px; height:180px; color: white; border: solid 1px white; margin-left: 10px; float: left; } .subDivCls { width:60px; height:60px; color:white; border: solid 1px white; font-size: 12px; margin: 5px; float: right; } .spanCls{ color:white; border: solid 1px white; margin: 5px; float: left; height: 50px; } div span{ border: solid 1px white; font-size: 12px; margin:5; } .cGreen{background-color: #4CA902} .cPink{background-color: #ED4A9F} .cBlue{background-color: #0092E7} .cCyan{background-color: #01A6A2} .cYellow{background-color: #DCA112} .cRed{background-color: #B7103B} .cPurple{background-color: #792F7C} .cBlack{background-color: #110F10} .hide{display: none;} </style> <script type=”text/javascript”> $(document).ready(function() { // 后代选择器 $(“#btn1”).click(function() { // $(“#div2 “).addClass(“cBlack”); // $(“#div2 #span1”).addClass(“cBlack”); // $(“#div2 .subDivCls”).addClass(“cBlack”); $(“#div2 span”).addClass(“cBlack”); }); // 子元素选择器 $(“#btn2”).click(function() { $(“#div2 > span”).addClass(“cBlack”); }); $(“#btn3”).click(function() { // $(“#div2 + div”).addClass(“cBlack”); // 注意:只有next:+;没有$(“#div2 -“).addClass(“cBlack”);这种写法! :( $(“#div2 +”).addClass(“cBlack”); // 但是其实 #div2 + div 也有一个好处,先确认next元素为div元素才会选中,不然不会选中! }); // 兄弟选择器,只能从当前开始,同级往后。 $(“#btn4”).click(function() { // $(“#div2 ~”).addClass(“cBlack”); $(“#div2 ~ div”).addClass(“cBlack”); }); $(“#btn5”).click(function() { // 选择所有的兄弟标签 // $(“#div2”).siblings().addClass(“cBlack”); // 只要兄弟标签中的div标签 $(“#div2”).siblings(“div”).addClass(“cBlack”); });
</div> <div id=”div3″ class=”divCls cBlue” title=”itcast”> id 为div3 的div,title为itcast,包含隐藏输入框 <input type=”hidden” value=”hello”> </div> <span class=”spanCls cRed”>div3的兄弟元素span</span> <div id=”div4″ class=”divCls cYellow”>id 为div4 的div<br> <div class=”subDivCls” style=”float:left;”>subDivCls<br> <span id=”span2″>span4</span></div> <div class=”subDivCls” title=”itcast”>title为itcast</div> <div class=”subDivCls” style=”float:left;”>class为subDivCls的div</div> <div class=”subDivCls”></div> </div> <div class=”divCls cCyan hide”>class设置为隐藏的,隐藏div</div> <div class=”divCls cPurple” style=”display: none”>style的display为none的隐藏div</div> <div style=”clear: both;”></div> <br><br> <hr> <input type=”button” id=”btn1″ value=”选取id为div2的所有span后代元素”> <input type=”button” id=”btn2″ value=”选取id为div2的所有span子元素”> <input type=”button” id=”btn3″ value=”选取id为div2的下一个div兄弟元素”> <input type=”button” id=”btn4″ value=”选取id为div2之后的所有div兄弟元素”> <input type=”button” id=”btn5″ value=”选取id为div2的所有div兄弟元素”> </body> </html>