JQ选择器

    技术2022-07-11  113

    什么是选择器:(近似于js原生中的document.getElementById..getElementsByTagName..document.querySelectAll) ===>就是能通过各种方式来选取到元素 1>基本选择器 a) ID选择器:$("#box") b) Class选择器: $(".box") c) 元素名称选择器 : $("div") d) 所有元素选择器 : $("*") e) 选取多个元素选择器: $("div,.item,span,p,#box") 2>层次选择器 a) 本元素下"所有"次级元素:$("div span") b) 本元素下一级(儿子辈)元素: $("div>span") c) 本元素同级下一个 :$("div + span") d) 本元素同级下所有 :$("div ~ span") 3>基本过滤选择器 :first ===》选取到第一个元素 :last ===》选取到最后一个元素 :not ===》除了($("li:not(:first)")) :even ===》选取到偶数行 :odd ===》选取到奇数行 索引都是从0开始 :eq ===》找到第几个 索引是从0开始 :gt ===》选取索引大于的 :lt ===》选取索引小于的 :header ===》选择标题元素h1.h2 :animated===》执行动画的元素 4>内容过滤选择器 :contains(text) ===》含有某一个文本 :empty ===》选取到不含有子元素的元素 :has(selector) ===》选取到含有某一个元素的元素 :parent ===》选取到含有子元素的元素(与empty相反) 5>可见性过滤选择器 :hidden ===>选取到不可见的元素 :visible ===>选取到可见的元素 用来做判断的 6>属性过滤选择器 [id] ===》选取到拥有id属性的元素 [id=box] ===》选取到id=box的元素 [id!=box]===》选取到id不等于box的元素 [id^=a] ===》选取到id的值以a开始 [id$=a] ===》选取到id的值以a结束 [id*=a] ===》选取到id的值只要含有a [id=a][class=b] ===》复合选择器 7>子元素过滤选择器(子元素的意思是下一级,不包括下下级) 父级元素 子元素:nth-child() ===》选取父级元素下的第几个子元素 **index从1开始,不是从0开始** 也可以填even或者odd(选取偶数/奇数),2n,3n,4n $("ul li:nth-child(2)") $("ul li:nth-child(even)") $("ul li:nth-child(4n)") :first-child ===》选取到第一个子元素 :last-child ===》选取到最后一个子元素 *************注意: $("ul li:first") ==>选取到第一个ul下的第一个li $("ul li:first-child") ==》选取到每一个ul下一级的第一个li ************* :only-child ===》选取到只有一个子元素的元素 8>表单属性状态过滤选择器 :enabled ===》选取到所有可用元素 :disabled===》选取到所有不可用元素 :checked ===》选取到所有选中的元素[单选,复选] :selected ===>选取到所有被选中的选项(option)元素[下拉框] 9>表单对象属性过滤选择器 :input ===》选取所有的<input>,<textarea>,<select>和<button>元素 :text ********对象之前的转换******** jquery对象转换为DOM对象: 1》$("#box")[0] 2》$("#box").get(0) DOM对象转换为jquery对象 $(box)
    Processed: 0.010, SQL: 9