ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

JQuery中的选择器

2022-02-24 11:58:43  阅读:137  来源: 互联网

标签:JQuery 获取 li ul div 选择器


JQuery属于JavaScript中的一个库文件,相对于JavaScript,编程更快捷和简洁,最主要可以实现链式编程和隐式迭代等特点。下面我将整理一下JQuery中选择器的使用。

以以下代码为例:

 <div>d0</div>
    <a href=""></a>
    <ul>
        <div>d1</div>
        <li class="ww">0</li>
        <li>
            <h1 class="ww">1</h1>
        </li>
        <li class="ww">2</li>
        <li id="cc">3</li>
    </ul>
    <div>d2</div>

基础用法

$() 和CSS选择器相似,如想要获取<li class="ww"></li>这类元素,只需$('.ww')即可,同理如果想要获取<li id="cc"></li>,只需$('#cc')即可,如果没有class和id,如<div></div>,要想获取此类标签,只需$('div')即可。在JQuery中CSS的子代选择器也可以使用,如想要获取ul中的li里的h1标签如<h1 class="ww">1</h1>,便可以使用$('ul>li>h1')。

高级用法

在li列表中,若想要获取第一个或最后一个li,可以使用$('li:first')或$('li:last')

eq代表索引值,如想要获取<li class="ww">0</li>,可以使用$('li:eq(0)')

even代表拿到偶数项,odd代表拿到奇数项,即$('div:even')或$('div:odd')

parent可以直接拿到父级节点,parents中可以附加参数,来指明找寻所需的父级,如$('li').parent()或$('li').parents('body')

children方法只能找到子级节点,孙子节点不行,如$('ul').children('div')

find可以找寻后代,不过参数位置要有值,即$('ul').find('h1')

siblings可以找到所有的兄弟节点,参数可填,即$('ul').siblings()

nextAll找到所有后面的元素,preAll找到所有前面的元素,他们两个参数都可填,如$('ul').nextAll()或$('ul').prevAll()

hasClass可以检查被选元素是否包含指定的 class,即$('li').hasClass("ww")

标签:JQuery,获取,li,ul,div,选择器
来源: https://blog.csdn.net/Fengziwei_/article/details/123107203

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有