<!DOCTYPE html> <html><head><meta charset="UTF-8"><title>位置选择器</title><script src="js/jquery.js"></script><script type="text/javascript">$(function(){//获取第一个li$("li:first").css("border","2px dotted red");//获取最后一个出现的DIV$("div:last").css("border","2px dotted black");//奇数 odd 段落,在jQuery中所有的元素从0开始$("p:odd").css("border","2px dotted blue");//偶数 even 输入框$("input[type='text']:even").css("border","2px dotted orange");//第三个超链接 使用eq精确指定组建下标位置$("a:eq(2)").css("border","2px dotted lightblue");//获取第三个之后的超链接 使用gt获取指定位置之后的所有元素$("a:gt(2)").css("border","3px dotted red");//利用lt获取指定位置之前的元素$("p:lt(1)").css("border","4px soild red");})</script></head><body><div><ul><li>li111111</li><li>li2222222</li><li>li33333</li></ul></div><div><p>p1</p><p>p2</p><p>p3</p><p>p4</p><p>p5</p></div><div>姓名<input type="text" /><br>姓名1<input type="text" /><br>姓名2<input type="text" /><br>姓名3<input type="text" /><br>姓名4<input type="text" /><br>姓名5<input type="text" /><br></div><div><a href="#">href1</a><a href="#">href2</a><a href="#">href3</a><a href="#">href4</a><a href="#">href5</a></div></body> </html>