Jquery基本、层次选择器
基本选择器:
$("#none").css("background","#bbffaa");
改变id为none的所有元素的背景色
$(".mini").css("background","#bbffaa");
改变class为mini的所有元素的背景色
$("*").css("background","#bbffaa");
改变所有元素的背景色
$("span,#two").css("background","#ddffaa");
改变所有<span>元素和id 为two的元素的背景色
层次选择器
$("ancestor descendant")
选取ancestor元素里的所有descendant(后代)元素
$("div span")选取<div>里所有的<span>元素
$("parent>child")
选取parent元素下的child(子)元素,与$("ancestor descendant")有区别,$("ancestor descendant")选择的是后代元素
$("div>span")选取<div>元素下元素名是<span>的子元素
$("prev + next")
选取紧接在prev元素后的next元素
$(".one+div")选取class为none的下一个<div>同辈元素
$("prev~siblings")
选取prev元素之后的所有siblings元素
$("#two~div")选取id为two的元素后面的所有的<div>同辈元素
$("body div").css("background","#bfa");
改变<body>内所有<div>的背景色
$("body>div").css("background"."#bfa");
改变<body>内子<div>元素的背景色
$(".one+div").css("background","#bfa");
改变class为one的下一个<div>同辈元素背景色
$("#two - div").css("background","#bfa");
改变id为two的元素后面的所有<div>同辈元素的背景色
等价关系
$(".one+div") 与 $(".one").next("div") 相等
$("#prev~div") 与 $("#prev").nextAll("div") 相等
摘自《锋利的JQuery》 第二章 2.31 基本选择器 2.3.2 层次选择器
Jquery基本、层次选择器的更多相关文章
- 黑马day16 jquery&层次选择器
假设想通过DOM元素之间的层次关系来获取特定元素,比如后代元素,子元素,相邻元素,兄弟元素等,则须要使用层次选择器. 1 .ancestor descendant 使用方法: $("form ...
- jQuery之层次选择器
层次选择器: 查找子元素, 后代元素, 兄弟元素的选择器1. ancestor descendant 在给定的祖先元素下匹配所有的后代元素2. parent>child 在给定的父元素下匹配所有 ...
- JQuery 层次选择器
<!DOCTYPE HTML> <html> <head> <title> 使用jQuery层次选择器 </title> <scrip ...
- jQuery层次选择器
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- jQuery选择器介绍:基本选择器、层次选择器、过滤选择器、表单选择器
选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Ajax操作都依赖于选择器.因此,如果能熟练的使用选择器,不仅能简化代码,而且可以达到事半功倍的效果.jQuery选择器完全继承了 ...
- jQuery选择器之层次选择器Demo
测试代码: 02-层次选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...
- jQuery基础学习7——层次选择器find()方法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery选择器---层次选择器总结
今天要分享的是jQuery层次选择器,层次选择器的分类如图: 接下来就开始了 要不先养养眼精神一下: 开始1.祖先选择器: 案例: <form> <label>Name:< ...
- jquery层次选择器:空格 > next + nextAll ~ siblings
全栈工程师开发手册 (作者:栾鹏) jquery系列教程1-选择器全解 jquery层次选择器 jquery层次选择器,包括空格.>.next.+.nextAll.~.siblings等函数或表 ...
随机推荐
- zjtd 2016面试
1.写一个函数get_next() class A{ public :int next(); //取下一个值,并且指针后移 bool has_next(); private: //可以认为是一个q ...
- textarea输入框限制字数(JS)
第一种: <textarea onkeyup="checkLen(this)"></textarea> <div>您还可以输入 <span ...
- tar+gzip
tar打gzip包: tar -czvf sourceDir.tar.gz sourceDir tar查看压缩包内容: tar -tvf sourceDir.tar.gz tar解压缩包crontab ...
- 20145227 《Java程序设计》第3周学习总结
20145227 <Java程序设计>第3周学习总结 教材学习内容总结 第四章 认识对象 4.1 类与对象 1.定义类:生活中描述事物无非就是描述事物的属性和行为.如:人有身高,体重等属性 ...
- SDUT 2413:n a^o7 !
n a^o7 ! Time Limit: 1000MS Memory limit: 65536K 题目描述 All brave and intelligent fighters, next you w ...
- SQL-PIVOT 数据透视 行列转换
-- 数据透视 -- PIVOT: 行转列 SELECT * FROM ( SELECT N'张三' AS 姓名, N'语文' AS 课程,70 AS 分数 UNION SELECT ...
- mysql一些常用命令总结
mysql时间戳转日期格式SELECT FROM_UNIXTIME(add_time,'%Y-%m-%d %H:%i:%s') FROM `wh5_username` where id=23; 按in ...
- 0. WP8.1学习笔记
应用程序生命周期: 运行: 在程序NotRunning状态下点击图标,应用将处于Running状态,这会触发一个Actived事件 挂起: 在程序Running状态下, 点击返回键或win键会触发一个 ...
- muduo库安装
一.简介 Muduo(木铎)是基于 Reactor 模式的网络库. 二.安装 从github库下载源码安装:https://github.com/chenshuo/muduo muduo依赖了很多的库 ...
- easyUI单元格合并自定义封装
1.指定列的行合并 * 效果图: 合并自定义封装(一) * 程序: function mergeGridColCells(grid,rowFildName) { var rows=grid.dat ...