首先引入jQuery的类库，代码如下，标出注释了的，不要在引入类库里写方法，我们需要重写一个script在继续写方法；下标是往0开始的
<html><head><meta charset="utf-8"><title></title><!-- 引入外部js=jQuery的类库 --><script src="js/jquery-3.3.1.js" type="text/javascript"></script><script type="text/javascript">$(function(){//相当于window.onload//过滤选择器$("ul>li:first").css("background","yellow");//第一$("ul>li:last").css("background","yellow");//最后$("ul>li:even").css("background","yellow");//奇数$("ul>li:odd").css("background","yellow");//偶数$("ul>li:gt(0)").css("background","yellow");//大于$("ul>li:lt(4)").css("background","yellow");//小于//0>x<4$("ul>li:lt(4):gt(0)").css("background","yellow");//大于0小于4})</script></head><body><ul><li>0-单身</li><li>1-好男人</li><li>2-高冷男</li><li>3-逗比</li><li>4-清高</li></ul></body></html>
层次选择器和上面的代码差不多的不懂的我那写了有注释
<html><head><meta charset="utf-8"><title></title><!-- 引入外部js=jQuery的类库 --><script src="js/jquery-3.3.1.js" type="text/javascript"></script><!-- 另起一个script块 --><script type="text/javascript">$(function(){//相当于window.onload//2.2层次选择器$("#xx").css("background","yellow")$(".yy").css({"background":"yellow","color":"red"});//类选择器$("div").css("background","pink");//标签选择器=元素选择器$("*").css("background","yellow");//通配符:全部$("p,span").css("background","yellow");//并集$("div span").css("background","yellow");//交集 后代标签span$("div>span").css("background","yellow");//父子关系$("p+span").css("background","yellow");//兄弟关系 p后面紧跟着的span})</script></head><body><div id="xx"><p>这是第一个div中的段落 <span>单身强羡慕</span></p><span>谢波和张成的内部爱情故事</span></div><div class="yy">这是第二个div</div><p>这是第一个外面的段落</p><span>蛤蟆和麻拐的内部爱情故事</span></body></html>
接下来就是表单选择器
<html><head><meta charset="utf-8"><title></title><!-- 引入外部js=jQuery的类库 --><script src="js/jquery-3.3.1.js" type="text/javascript"></script><!-- 另起一个script块 --><script type="text/javascript">$(function(){//相当于window.onload//给按钮添加点击事件$("#ok").click(function(){//拿性别var sex = $("#myForm input:radio:checked").val();console.info(sex);//拿爱好$("#myForm input:checkbox:checked").each(function(){console.info($(this).val());})//拿地址var address=$("#myForm select option:selected").val();console.info(address);})})</script></head><body><h4>2.4表单选择器</h4><form action="" id="myForm">性别:<input type="radio" name="sex" value="男"/>男<input type="radio" name="sex" value="女"/>女<br>爱好：<input type="checkbox" value="看美女"/>看美女<input type="checkbox" value="看帅哥"/>看帅哥<input type="checkbox" value="打游戏"/>打游戏<br />地址:<select><option value="湖南省">湖南省</option><option value="海南省">海南省</option><option value="湖北省">湖北省</option></select><br /><input type="button" value="提交" id="ok"/></form></body></html>
以上呢就是三个选择器，有用的到小伙伴帮忙点个关注，第一次写博客，不好的还请指出
