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

二.选择器

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()
    //      是返回链式编程中,当前操作标签的上一个操作的标签
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 环境搭建 进入官方网站获取最新的版本 http://jquery.com/download/ ,这里需要注意 j...
    阿r阿r阅读 822评论 0 7
  • 一、样式篇 第1章 初识jQuery (1)环境搭建 进入官方网站获取最新的版本 http://jquery.co...
    凛0_0阅读 3,450评论 0 44
  • jQuery基础(一)——样式篇 1-2环境搭建 1-3 jQuery HelloWorld体验 $(docume...
    croyance0601阅读 1,104评论 0 8
  • 一.什么是jQuery jQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一整...
    love2013阅读 595评论 0 4
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,290评论 0 3