第二章jQuery选择器

简介: 第二章jQuery选择器

一、jquery选择器的分类:


1.基本选择器


(1)标签选择器

$(“h2”).css(“color”,“red”);


(2)类选择器

$(".title").css(“color”,“red”);


(3)ID选择器

$("#title").css(“color”,“red”);


(4)并集选择器

$(“h2,h3,.title,#title”).css(“color”,“red”);


(5)全局选择器

$("").css(“color”,“red”);



2.层次选择器


(1)后代选择器

$("#box p").css(“color”,“red”)


所有box下面的p标签字体都换成红色


(2)子选择器

$("#box>p").css(“color”,“red”);


所有id为box的儿子元素字体变成红色


(3)相邻元素选择器:

$(".p2+p").css(“color”,“red”);


class为p2的元素下一个为p的字体变红


(4)同辈元素选择器:


(5)[name=na],name的值以na结束的被选中


(6)[name=na],name的值中包含na的被选中


(7)[name=‘text’][id=‘name’],属性name的值等于name,并且id也等于name的被选中


4.基本过滤选择器


(1)获取第一个li元素:

$(“li:first”).css(“color”,“red”);


(2)获取最后一个li元素:

$(“li:last”).css(“color”,“red”);


(3)获取偶数行的元素:

$(“li:even”).css(“color”,“red”);


(4)获取奇数行的元素:

$(“li:odd”).css(“color”,“red”);


(5)获取索引是2的元素

$(“li:eq(2)”).css(“color”,“red”);


(6)获取索引大于2的元素,索引从0开始

$(“li:gt(2)”).css(“color”,“red”);


(7)获取索引小于2的元素

$(“li:lt(2)”).css(“color”,“red”);


(8)获取所有标题元素

$(":header").css(“color”,“red”);


(9)获取光标聚焦的元素

$(":focus").css(“color”,“red”);


5.可见性过滤选择器





二、光标聚焦:


$("[name=‘text’]").focus();


三、给表单里面赋值:


$("[name=‘pass’]").val(“值”);


四、获取表单的值:

$("#input").val();



目录
相关文章
N..
|
1月前
|
JavaScript 前端开发 开发者
jQuery选择器
jQuery选择器
N..
14 1
|
3月前
|
JavaScript
jquery的9大选择器
jquery的9大选择器
28 2
|
3月前
|
JavaScript
jQuery :nth-of-type(n)选择器的用法详解
jQuery中,:nth-of-type(n)选择器可以对selector选择器匹配选择到的所有HTML元素进行二次匹配选择,为了更好地阐述:nth-of-type(n)的语法,这里假设selector是一个元素p选择器,如此,:nth-of-type(n)可以用于匹配p元素选择器选择到的p元素指向的父元素中第n个类型为p的子元素,而且与p是否是该父元素的第n个子元素无关,比如
40 5
|
6月前
|
JavaScript 前端开发 索引
jQuery入门&以及选择器
jQuery 是一个快速、简洁的 JavaScript 库,其设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。
31 0
|
6月前
|
JavaScript 前端开发 Java
jQuery入门&选择器
jQuery入门&选择器
|
6月前
|
存储 JavaScript 前端开发
jQuery 入门&选择器
jQuery 入门&选择器
37 0
|
1月前
|
JavaScript
jQuery选择器案例之——index.js
jQuery选择器案例之——index.js
8 0
|
1月前
|
JavaScript
jQuery选择器案例之——index.html
jQuery选择器案例之——index.html
9 1
|
1月前
|
JavaScript 前端开发
jQuery选择器整理
jQuery选择器整理
13 0
|
1月前
|
前端开发 JavaScript 索引
第二章jQuery选择器
第二章jQuery选择器
8 0