jquery常用筛选方法
admin
2023-02-12 19:20:02
0

1、jquery过滤方法
eq(index|-index)
first()
last()
hasClass(class)
filter(expr|obj|ele|fn)
is(expr|obj|ele|fn)
map(callback)
has(expr|ele)
not(expr|ele|fn)
slice(start,[end])
具体事例如下:

  • 第一个
  • 第二个
  • 第三个
  • 第四个
  • 第五个

eq() 获取子元素里面的其中某一个,根据索引来获取。 -index -1开始的

console.log($("ul>li:first"));
    console.log($("ul>li:eq(0)"));
    console.log($("ul>li:nth-child(1)"));
    console.log($("ul>li").eq(0));//上面四个等价均是第一个li
    console.log($("ul>li").eq(-1));
    console.log($("ul>li:last"));

hasClass(class) 根据元素的类名称来进行过滤的 参数是class名称
用来判断某个元素是否具有class名称 true/false
console.log($("ul>li").eq(2).hasClass("box"));
filter 过滤 fn(index,ele)

console.log($("ul>li").filter(".box"));
console.log($("ul>li").filter($(".box")));

is() expr|obj|ele|fn 判断当前元素是什么 返回值 true/false

console.log($("ul>li").is(".box"));
console.log($("ul>li").is($(".box")));

map映射两种使用
第一种将一个集合映射为一个新的集合 带返回值
第二种 不写返回值 map可以作为遍历来使用
必须有回调函数 参数为index,ele
jquery 对象集合转为数组 需要get()
get(index) js对象 不同于eq(index) 返回的是jquery对象

console.log($("ul>li")[0]);
console.log($("ul>li").get(0));

has()过滤元素 把当前需要的过滤出来 不需要的去除 参数可以是selecto dom
参数写成.box都匹配不到元素(直接找的匹配元素的同级)
参数写成.box 过滤的元素必须是匹配的元素子内容
console.log($("ul>li").has(".child"));
not() 除过 回调函数参数index ele
console.log($("ul>li").not(".box"));
console.log($("ul>li").not($(".box")));
slice()参数是start end 类似数据的slice 截断 取小不取大
console.log($("ul>li").slice(0, 2));
2、查找
children([expr])
closest(e|o|e)1.7*
find(e|o|e) expr jquery对象 ele
next([expr])
nextAll([expr])
nextUntil([e|e][,f]) 类似nextAll 方法
offsetParent()
parent([expr])
parents([expr])
parentsUntil([e|e][,f]) 下去自己看
prev([expr])
prevAll([expr])
prevUntil([e|e][,f]) //下去自己看
siblings([expr])

children 获取子元素的 获取所有的子集元素(直接子集)
children 参数expr 选择器 可以作为简单过滤

find 查找 参数可以是expr jquery对象 ele
next 获取当前匹配元素的下一个 nextAll 获取当前匹配元素之后的所有元素
next nextoAll 方法的参数 expr 表达式
prev prevAll 同上
offsetParent() 该方法返回的父元素是定位的 在父亲元素中找最近的定位父元素
parent 获取直接父元素 parents所有父亲
siblings 同胞兄弟元素 不带参数 指获取所有的同胞兄弟 参数expr 表达式 用来过滤元素使用

3、串联
add(e|e|h|o[,c])1.9*
addBack()1.9+
contents()
end()

  • 1
  • 2
  • 3
  • 4

ppp

p2222

add() 给jquery对象添加新的对象

console.log($("ul>li").add($("p")));
console.log($("ul>li").add("p"));
console.log($("ul>li").add(".p1"));

addBack()
console.log($("ul>li").eq(1).nextAll().addBack());//元素234
contents 获取当前元素的所有节点 包含文本 childrenNodes
end 方法是回到上一次破坏性修改 上一次修改jquery对象

相关内容

热门资讯

德国总理:美国正在被伊朗羞辱 德国之声4月27日报道,德国总理默茨在访问一所学校时表示,在当前的持续冲突中,伊朗领导层正试图羞辱美...
理响中国|“长”歌以行,风云激... 光阴如梭,东方潮阔。这里是中国的长三角,世界的长三角。无论过去、现在还是未来,这片土地都因时代而生,...
白宫:特朗普及其国安团队开会讨... 新华社华盛顿4月27日电 美国白宫新闻秘书莱维特27日在记者会上证实,总统特朗普及其国家安全团队当天...
人民日报刊文:日本放开杀伤性武... 日本放开杀伤性武器出口推高地缘冲突风险(国际论坛)常思纯《人民日报》(2026年04月28日 第 0...
医疗保障法草案二审:明确生育保... 满足多样化健康保障需求本报记者 彭 波4月27日,医疗保障法草案二审稿提请十四届全国人大常委会第二十...
天津一景区发生自转旋翼机事故1... 澎湃新闻记者 吕新文中国民用航空华北地区管理局4月22日公布《豪客通航“10•1”天津长芦汉盐旅游区...
卡塔尔埃米尔与美国总统特朗普通... 当地时间24日,卡塔尔埃米尔塔米姆与美国总统特朗普通电话,重点就中东地区局势以及伊朗与美国谈判问题交...
男子30年前被扣押2859克黄... 澎湃新闻记者 王鑫家住辽宁省大连市的潘永嘉近日向澎湃新闻反映称,三十年前,他在大连周水子机场被盖州市...
商务部:取消反制欧盟两家金融机... 中华人民共和国商务部令二〇二六年 第1号鉴于欧盟已取消对中国两家金融机构的制裁措施,现公布《关于取消...
过去24小时共有5艘船只通过霍... 总台记者当地时间24日获悉,过去24小时内,共有5艘船只通过霍尔木兹海峡,其中包括一艘伊朗油轮。(总...