选择器

原生: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(正常数字)");//不是索引值

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一)jQuery九类选择器【参见jQueryAPI.chm手册】 目的:通过九类选择器,能定位web页面(HTML...
    奋斗的老王阅读 1,056评论 0 51
  • 一、基本选择器 1.id选择器 找到id=main的元素给它增加border:1px solid red; 2.标...
    mkmolecule阅读 284评论 0 0
  • 作为前端和后台最基础可靠的神器工具JQuery,你真的对她有足够了解么? 亚非拉地区苦逼的前端er们,有时候不得不...
    扭了个妞阅读 390评论 0 0
  • 常规选择器 jquery最核心的组成部分就是:选择器引擎。他继承了css的语法。可以对DOM元素的标签名,属性名,...
    我拥抱着我的未来阅读 295评论 0 1
  • 在无奈的逃避与折磨中香消玉殒 《小城三月》虽然只是不太长的中篇小说,但是读后给我的震撼是巨大的,一...
    许生说阅读 606评论 0 2