美文网首页
jQuery入门二之选择器与筛选器

jQuery入门二之选择器与筛选器

作者: Red_b759 | 来源:发表于2020-02-25 20:47 被阅读0次

二.选择器

1.概念

jQuery通过选择器获取的标签对象,都是伪数组的形式
eg: $('#box') = document.getElementById('#box');

2.转化

  • JavaScript语法获取的标签对象,不能使用jQuery语法操作,jQuery语法获取的标签对象,也不能使用JavaScript语法操作,必须要相互转化。
  • JavaScrip标签对象转化为jQuery标签对象
    $(js对象)
  • jQuery标签对象转化为JavaScript标签对象
    $(jQuery标签对象)[索引下标]

3.方法

  • id选择器
$('#id选择器名称')
  • class选择器
$('.class选择器名称')
  • 标签选择器
$('标签名称')
  • css选择器
$('ul>li')
$('[name="abc"]')
$('div#box')
  • 结构伪类选择器
$('ul>li:first') //第一个
$('ul>li:last')//最后一个
$('ul>li:eq(索引)')//按照索引,获取标签对象
$('ul>li:odd()') //获取索引数值是奇数的标签
                   //索引数值是奇数,标签个数是偶数
$('ul>li:even()')  // 获取索引数值是偶数的标签
                      //索引数值是偶数,标签个数是奇数

三.筛选器

1.概念

在通过jQuery选择器获取到的标签对象的基础上,再使用筛选器,获取符合条件的标签。

2.方法:

$( ).first()//第一个
$( ).last()//最后一个
$( )..eq()//按照下标获取
$( ).prev()//上一个兄弟
$( ).next()//下一个兄弟
$( ).prevAll()//之前所有兄弟
$( ).nextAll()//之后所有兄弟
$( ).siblings()//上下所有的兄弟
$( ).parent()//直接父级
$( ).parents()//所有父级
                //最后两个一定是body和html
$( ).find(条件)//找寻子级中符合条件的标签
$( ).end( )//返回链式编程的上一个操作对象
    //与parent()的区别
    //  parent()
    //      是当前操作标签的父级标签
    //  end()
    //      是返回链式编程中,当前操作标签的上一个操作的标签

相关文章

  • jQuser有选择器

    jQuery基本选择器 jQuery过滤选择器 jQuery层级选择器 jQuery筛选选择器(方法)

  • jQuery入门(2)

    jQuery选择器 属性筛选选择器 子元素筛选选择器 表单元素选择器 表单对象属性筛选选择器 特殊选择器this ...

  • jQuery入门二之选择器与筛选器

    二.选择器 1.概念 jQuery通过选择器获取的标签对象,都是伪数组的形式eg: $('#box') = doc...

  • 前端-4

    jQuery 基本语法: $(selector).action() 选择器 筛选器

  • 前端学习之jQuery

    选择器 基本选择器 层级选择器(重点)、基本过滤选择器 筛选选择器 使用jQuery操作DOM 样式操作 样式属性...

  • jQuery选择器

    一、jQuery常用选择器 二、jQuery选择器优势 三、jQuery常用基本选择器 四、jQuery常用层次选...

  • jquery 选择器

    jQuery层级选择器 基本筛选选择器 注意事项: :eq(), :lt(), :gt(), :even, :od...

  • 08-jQuery

    一.初识jQuery 二.jQuery与原生DOM互转 三.基本选择器 四.层级选择器 五.伪类选择器 六.属性操...

  • JQuery

    JQuery 基础:概念快速入门JQuery对象和JS对象区别与转换选择器DOM操作案例 JQuery 基础: 概...

  • jquery选择器书目录

    jquery选择器-基本选择器 jquery选择器-层级选择器 jquery选择器-基本过滤选择器 jquery选...

网友评论

      本文标题:jQuery入门二之选择器与筛选器

      本文链接:https://www.haomeiwen.com/subject/foqqchtx.html