选择器

2017-12-12  本文已影响0人  始于颜值忠于你_89a0

原生:window.onload=function(){};

jQuery:jQuery(document).ready(function(){});

//文档加载就绪函数

jQuery 等价 $


基本选择器:

id:$("#box");

class:$(".box");

元素:$("div");


属性:

$("input[type='button']");

$("input[type=button]");


层次选择器:

$("ul>li>input");//$("父级ul>直接子级li>li的直接子级");

$("ul li input");//$("父级ul 某一个子孙");

$(".box+li");另一种写法:$(".box").next("li");//.box的下一个兄弟节点

$(".box~li");另一种写法:$(".box").nextAll("li");//.box的后面所有的li兄弟节点


子元素选择器:

$("div").children();//代表div里面所有的子元素

$("div").children("span");//代表div里面所有的子元素span

$("div").children("p:eq(1)")

$("div").children("p").eq(1);

$("div").find("p").eq(1);

//以上都是代表div里面所有的子元素p中下标第一个


表单对象选择器:

$(":disabled");//选择所有不可用元素

$("ul input:disabled");//选择ul下面表单元素所有不可用元素

$(":enabled");//选择所有可用元素


筛选选择器:

$("ul li:first").css("background","red");//第一个

$("ul li:last").css("background","blue");//最后一个

$("ul li:odd").css("background","blue");//奇数

$("ul li:even").css("background","green");//偶数

$("div:has(p)");//包含p标签的div

$("div:contains(你好)");//包含文本的div

$("div:empty");//匹配所有不包含子元素或者文本的空元素

$("div:parent");//只要包含文本或者元素都可以

$("ul :nth-child(正常数字)");//不是索引值

上一篇下一篇

猜你喜欢

热点阅读