<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><script src="https://code.jquery.com/jquery-3.4.1.min.js"></script></head><body><div class="one" id='red'>div1 div1</div><div class="two" id='blue'>div2 div2</div><p id='f'>fff</p><div class="three" id='gray'><p id='a'>aaa</p><p id='b'>bbb</p><p id='c'><span>ccc</span></p><p id='d'>ddd</p></div><p id='e'>eee</p><p id='h'>hhh</p><p id='i'>iii</p><script>console.log( $('#red') ); // 通过 #id 调出div1console.log($('.two')); //通过 .class调出div2console.log($('p')); // element 调出全局p 5个console.log($('div')); // element 调出全局div 共3个////////////////////////////////console.log($('div p')); //全局div下所有p，包含子级和孙子级console.log($('#gray p')); //调用id为gray下的所有p，包含子级和孙子级console.log($('.three p')); //调用class为three下的所有p，包含子级和孙子级////////////////////////////////console.log($('div>p')); //全局div下所有子级pconsole.log($('#gray>p')); //调用id为gray下的子级pconsole.log($('.three>p')); //调用class为three下的子级p////////////////////////////////console.log($('div + p')); //全局div后面的平级pconsole.log($('.three + p')); //class为three的后面的相邻平级p;console.log($('#gray ~ p')); // #gray的后后面的所有平级p</script></body></html>
博客列表 >jq 选择器，#id .class element 和 parent>p prev+next prev~siblings
jq 选择器，#id .class element 和 parent>p prev+next prev~siblings
- 张浩刚原创转载
- 2019年12月20日 14:44:16814浏览
上一条：html知识点下一条：jQuery选择器--php培训九期线上班
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议
