jquery层级选择器
来源:互联网 发布:1加到100的c语言程序 编辑:程序博客网 时间:2024/05/18 19:20
> (大于号) 紧跟父子关系 如$("div > p")表示选择div下的直接层是p的节点。+ (加号) 紧跟兄弟关系 如$("div + p")表示选择div同层的后面相邻的p节点。~ (波浪线) 任意距离兄弟关系 如$("div ~ p")表示选择div同层的p节点。(空格) 任意层父子关系 如$("div p")表示选择div下的p节点(不管中间隔多少层)。,(逗号) 表示选择器组合,如$("div p, span p")表示div下p节点和span下p节点。
<!DOCTYPE html><html><head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title></title> <link rel="stylesheet" href="imooc.css" type="text/css"> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script></head><body> <h2>子选择器与后代选择器</h2> <div class="left"> <div class="aaron"> <p>div下的第一个p元素</p> </div> <div class="aaron"> <p>div下的第一个p元素</p> </div> </div> <div class="right"> <div class="imooc"> <article> <p>div下的article下的p元素</p> </article> </div> <div class="imooc"> <article> <p>div下的article下的p元素</p> </article> </div> </div> <script type="text/javascript"> //子选择器 //$('div > p') 选择所有div元素里面的子元素P $('div > p') .css("border", "1px groove red"); </script> <script type="text/javascript"> //后代选择器 //$('div p') 选择所有div元素里面的p元素 // $('div p').css("border", "1px groove blue"); </script> <h2>相邻兄弟选择器与一般兄弟选择器</h2> <div class="bottom"> <div>兄弟节点div, +~选择器不能向前选择</div> <span class="prev">选择器span元素</span> <div>span后第一个兄弟节点div</div> <div>兄弟节点div <div class="small">子元素div</div> </div> <span>兄弟节点span,不可选</span> <div>兄弟节点div</div> </div> <script type="text/javascript"> //相邻兄弟选择器 //选取prev后面的第一个的div兄弟节点 $(".prev+div").css("border", "3px groove blue"); </script> <script type="text/javascript"> //一般相邻选择器 //选取prev后面的所有的div兄弟节点 $(".prev~div").css("border", "3px groove blue"); </script></body></html>
0 0
- jQuery层级选择器
- jQuery层级选择器
- JQuery中的层级选择器
- jQuery层级选择器
- jQuery层级选择器
- jquery层级选择器
- jQuery层级选择器
- jquery的层级选择器
- jQuery层级选择器
- jQuery层级选择器
- jquery层级选择器
- jQuery选择器之层级选择器
- jQuery选择器之层级选择器
- jQuery选择器之层级选择器
- jQuery选择器之层级选择器
- jQuery选择器之层级选择器
- jQuery选择器之层级选择器
- jquery选择器之层级选择器
- java读取csv文件并将其转成json
- 数据结构期末总结
- W77E516机器周期与时钟周期
- OC与JS的互调
- SPARK+ANSJ 中文分词基本操作
- jquery层级选择器
- 第十五周项目1-(1)-验证哈希表实施查找的相关算法
- 【VSCode】Windows下VSCode编译调试c/c++
- 女孩子:现代的“三从四德”
- 如何保存EDIUS工程里面的素材
- 【Linux】fork()
- 创建ITS mobile 应用程序步骤
- Spring Boot 添加JSP支持
- C++ const 常量