jQuery选择集转移怎么操作?如何写代码?选择集是通过$()方法获取到的所有标签的集合。选择集转移以选择的标签为参照获取转移后的标签。
选择集转移学习目标:能够说出2种选择集转移方法
1.选择集转移是什么?
选择集转移就是以选择的标签为参照,然后获取转移后的标签。
2. 选择集转移操作
$('#box').prev(); 表示选择id是box元素的上一个的同级元素
$('#box').prevall(); 表示选择id是box元素的上面所有的同级元素
$('#box').next(); 表示选择id是box元素的下一个的同级元素
$('#box').nextAll(); 表示选择id是box元素的下面所有的同级元素
$('#box').parent(); 表示选择id是box元素的父元素
$('#box').children(); 表示选择id是box元素的所有子元素
$('#box').siblings(); 表示选择id是box元素的其它同级元素
$('#box').find('.myClass'); 表示选择id是box元素的class等于myClass的元素
选择集转移的示例代码:
<script> $(function(){ var $div = $('#div01'); $div.prev().css({'color':'red'}); $div.prevall().css({'text-indent':50}); $div.next().css({'color':'blue'}); $div.nextAll().css({'text-indent':80}); $div.siblings().css({'text-decoration':'underline'}) $div.parent().css({'background':'gray'}); $div.children().css({'color':'red'}); $div.find('.sp02').css({'font-size':30}); }); </script><div> <h2>这是第一个h2标签</h2> <p>这是第一个段落</p> <div id="div01">这是一个<span>div</span><span class="sp02">第二个span</span></div> <h2>这是第二个h2标签</h2> <p>这是第二个段落</p></div>
jQuery选择集转移小结:
prev() 表示获取上一个同级元素
prevall() 表示获取上面所有同级元素
next() 表示获取下一个同级元素
nextAll() 表示获取下面所有同级元素
parent() 表示获取父元素
children() 表示获取所有的子元素
siblings() 表示获取其它同级元素
find("选择器名称") 表示获取指定选择器的元素
微信扫码关注公众号
获取更多考试热门资料