02jquery选择器(代码片段)

关键词：

基本选择器

通配符选择器：var all = $(‘*‘);  //根据   $(‘*‘)   获取。

  元素选择器：var ele = $(‘div‘);   //根据   $(‘元素名‘)   获取。如果给好几个元素绑定点击事件，$(this).index()可以确认点击的是第几个元素。

    类选择器：var cla = $(‘.bb‘);   //根据   $(‘.类名‘)   获取。

   id选择器 ：var iid = $(‘#idname‘);   //根据   $(‘#id名‘)   获取

群组选择器：var duo = $(‘#dd, .aa‘);   //可根据多个不同的选择器，一起选择起来

后代选择器：var hou = $(‘div p‘);   //选择div里面的p元素

  子选择器：var zi = $(‘div>p‘);   //选择div的子代p元素，不会选择孙代p元素

相邻兄弟选择器：var xiong = $(‘.gg+div‘);   //选择紧邻 .dd 后的，一个div兄弟。注：如果.dd有多个，则可能有多个紧邻的兄弟。

通用兄弟选择器：var txiong = $(‘.gg~div‘);   //选择 .dd 后的，所有div兄弟

属性选择器

$(‘[href]‘)　　//必须带有href属性
$(‘[id=aa]‘)　//必须有id属性，并且  属性值等于"aa"
$(‘[id!=aa]‘)    //其他的都能选择上，唯独id=aa的不选

$(‘[class^=c]‘)　　//必须有class属性，并且  属性值以"c"开头
$(‘[class*=e]‘) 　　　　///必须有class属性，并且  属性值含有"e"
$(‘[class$=d]‘) 　　//必须有class属性，并且  属性值以"d"结尾

$(‘[class$=d] [class*=e] [href]‘)   //必须多个属性同时满足  才能选择

//div [class~=bb]　　//div的classname，classname可以有多个类名，并且 bb类名前后 必须有空格

//aside [class|=f]　　　　//aside的classname，必须只有一个类名，并且类名以 f 或 f- 开头的元素

过滤器（child）

$(‘div>p:first-child‘)     //div下第一个元素必须是p

$(‘div>p:last-child‘)     //div下最后一个元素必须是p

$(‘div>p:nth-child(2)‘)     //div下第2个元素必须是p

$(‘div>p:nth-last-child(2)‘)     //div下倒数第2个元素必须是p

$(‘div>p:only-child‘)     //div下只有一个元素，且必须是p

过滤器（type）

$(‘div>p:first-of-type‘)     //div下可以有多个元素（包括p元素），取第一个p

$(‘div>p:last-of-type‘)     //div下可以有多个元素（包括p元素），取最后一个p

$(‘div>p:nth-of-type(2)‘)     //div下可以有多个元素（包括p元素），取第2个p

$(‘div>p:nth-last-of-type(2)‘)     //div下可以有多个元素（包括p元素），取倒数第2个p

//以上括号参数还可以为odd、even、n，其中n可以2n、3n、2n+1、2n-1等等

$(‘div>p:only-of-type‘)     //div下可以有多个元素，但p只能有一个

表单相关

$(‘:input‘)    //选择表单的各种输入元素，如input，textarea，select、button等等。

$(‘:text‘)        //选择<input type = ‘text‘ />

注：$(‘:typeValue‘)     //选择<input type = ‘typeValue‘ />，其中typeValue可以是password  radio  checkbox  image  reset  button  file  等等

$(‘:enabled‘)     //选择表单中的可用元素

$(‘:disabled‘)     //选择表单中的禁用元素

$(‘:checked‘)       //选择表单中被选中的元素，如复选框，单选框，select的option等等

$(‘:selected‘)        //选择表单中的select的option，:checked也可以选中，但为了语义化推荐用:selected

查找和过滤

find( expr | object | element )

var js = $(‘aside‘).find(‘div‘);    //在aside里面查找所有的div

children([expr])

var di = $(‘aside‘).children(‘div‘);    //在aside里面找到 子div，不包含孙代

parent([expr])

var pp = di.parent();     //查找di的父代

next([expr])

var a = $(‘p‘);

var b = a.next();    //查找b后面的一个同辈份的元素

prev([expr])

var a = $(‘p‘);

var b = a.prev();    //查找b前面的一个同辈份的元素

eq(num)

var li = $(‘li‘);

var ii = li.eq(3);  //在ii中选择第3个

var ii = li.eq(-5);  //在ii中选择倒数第5个

siblings([expr])

var v = $(‘div‘);

var si = v.siblings();   //选择除了v之外的，所有同辈份元素

filter( expr | object | element | fn)

var c = $(‘li‘);

var c = c.filter(‘.nb‘);    //在c中选择带有 nb类名 的元素

//若参数为function(index) console.log(index);  //index表示c里面元素的索引值 

注：num表示数字，[]里面表示可选，ecpr表示字符串，object表示现有的jquery对象(用jquery选择的对象)，element表示Dom元素名，fn表示函数(用来作为测试元素的集合)

02-jquery的选择器(代码片段)

我们以前在CSS中学习的选择器有：今天来学习一下jQuery选择器。jQuery选择器是jQuery强大的体现，它提供了一组方法，让我们更加方便的获取到页面中的元素。1、jQuery的基本选择器 代码如下：<!DOCTYPEhtml><htmllang="en"><... 查看详情

02-jquery的选择器(代码片段)

【转】02-jQuery的选择器 02-jQuery的选择器 我们以前在CSS中学习的选择器有：今天来学习一下jQuery选择器。jQuery选择器是jQuery强大的体现，它提供了一组方法，让我们更加方便的获取到页面中的元素。1、jQuery的基本选择器&n... 查看详情

02jquery选择器(代码片段)

基本选择器通配符选择器：varall=$(‘*‘);//根据$(‘*‘)获取。元素选择器：varele=$(‘div‘);//根据$(‘元素名‘)获取。如果给好几个元素绑定点击事件，$(this).index()可以确认点击的是第几个元素。类选择器：varcla=$(‘.bb‘);//根据$... 查看详情

02jquery的选择器(代码片段)

我们以前在CSS中学习的选择器有：今天来学习一下jQuery选择器。jQuery选择器是jQuery强大的体现，它提供了一组方法，让我们更加方便的获取到页面中的元素。1、jQuery的基本选择器 代码如下：<!DOCTYPEhtml><htmllang="en"><... 查看详情

jquery：jquery选择器(代码片段)

jQuery选择器类似于CSS选择器，用来选取网页中的元素。例如：$("h3").css("background-color","red"); 说明：获取并设置网页中所有<h3>元素的背景色。“h3”为选择器语法，必须放在$()中。$("h3")返回jQuery对象。一、jQuery选择器jQuery... 查看详情

jquery概述选择器(代码片段)

文章目录jQuery概述JavaScript库jQuery概念jQuery优点jQuery使用jQuery对象与DOM对象区别、转换jQuery选择器基本选择器基本过滤选择器内容过滤选择器属性过滤选择器子元素过滤选择器表单选择器jQuery筛选方法jQuery其它知识点jQuery概述JavaS... 查看详情

jquery——jquery选择器(代码片段)

##jQuery选择器先看看w3cschool的对jQuery的概述:jQuery选择器允许您对HTML元素组或单个元素进行操作。jQuery选择器基于元素的id、类、类型、属性、属性值等"查找"（或选择）HTML元素。它基于已经存在的CSS选择器，除此之外，... 查看详情

jquery概述及其选择器(代码片段)

目录jQuery的概述jQuery的使用方式jQuery的选择器基本选择器基本过滤选择器属性过滤选择器内容过滤选择器可见性过滤选择器表单对象属性过滤选择器表单选择器子元素选择器层次选择器jQuery的概述jQuery：是JavaScript的一个函数... 查看详情

jquery选择器(代码片段)

选择器并没有一个固定的定义，在某种程度上说，jQuery的选择器和样式表中的选择器十分相似。选择器具有如下特点：1．简化代码的编写2．隐式迭代3．无须判断对象是否存在其中“$”是选择器不可缺少的部分，在jQuery库... 查看详情

jquery选择器(代码片段)

本节我们来学习jQuery中的选择器，选择器是jQuery库中最重要的部分之一。jQuery选择器jQuery选择器允许我们选取和操作HTML元素，它用于根据HTML元素的名称、ID、类、类型、属性和属性值等来查找HTML元素。除了基于现有的CSS... 查看详情

jquery学习----选择器(代码片段)

 学习Jquery选择器之后，可以发现与css的选择器几乎相同，可能也就是最新的css选择器还不能在jquery中实现，但那都很少用。下面是Jquery中常见的选择器：一、基本选择器$("div").css("background-color","red");//表示对所有的div增加背... 查看详情

jquery选择器(代码片段)

目录jQueryjQuery的选择器 基本选择器：基本过滤选择器内容过滤选择器 属性过滤选择器表单选择器 表单对象属性过滤选择器jQueryjQuery：是JavaScript的一个库(对JavaScript的相关操作进行了封装：遍历HTML文档、操作DOM、... 查看详情

02_jquery_基础选择器

1.AllSelector("*")描述：选择所有元素语法：$("*")注意：实践证明，由于使用*选择器获取的是全部元素，因此，有些浏览器会比较缓慢，这个选择器也需要慎重使用。HTML代码<div><span></span><p></p><label></lab... 查看详情

jquery选择器(代码片段)

一:基本选择器 　　标签选择器：$("标签名");返回一组元素集合（匹配相同的标签名） 　　类选择器：$(".class类名"); 返回一组元素集合（匹配相同的class属性值） 　　id选择器：$("#id名"); 返回单个元素（匹配id属性值） 　　... 查看详情

jquery的选择器(代码片段)

 我们以前在CSS中学习的选择器有：今天来学习一下jQuery选择器。jQuery选择器是jQuery强大的体现，它提供了一组方法，让我们更加方便的获取到页面中的元素。1、jQuery的基本选择器 代码如下：<!DOCTYPEhtml><htmllang="en"&... 查看详情

jquery的选择器(代码片段)

我们以前在CSS中学习的选择器有：今天来学习一下jQuery选择器。jQuery选择器是jQuery强大的体现，它提供了一组方法，让我们更加方便的获取到页面中的元素。1、jQuery的基本选择器 代码如下：<!DOCTYPEhtml><htmllang="en"><... 查看详情

jquery选择器(代码片段)

jQuery元素选择器jQuery使用CSS选择器来选取HTML元素。$("p")选取<p>元素。$("p.intro")选取所有class="intro"的<p>元素。$("p#demo")选取所有id="demo"的<p>元素。jQuery属性选择器jQuery使用XPath表达式来选择带有给定属性的元素。$("[hr... 查看详情

jquery基础及选择器(代码片段)

基本选择器标签选择器$("h1").css("color","blue")类选择器$(".price").css("background":"颜色"，"padding":"5px")id选择器$("#author").css("color","颜色")；并集选择器$(".intro,标签1,标签2").css("color","颜色");全局选择器$("*").css("font-weight 查看详情