• Jquery-获取同级标签prev,prevAll,next,nextAll


    1、next([expr]):

    获取指定元素的下一个同级元素(注意是下一个同级元素哦)

    参数可有可无,参数设定遵循jquery选择器规则

    <!DOCTYPE html>
    <html>
    <head>
      <script type="text/javascript" src="/jquery/jquery.js"></script>
    </head>
    
    <body>
    <ul>
       <li>list item 1</li>
       <li>list item 2</li>
       <li class="third-item">list item 3</li>
       <li>list item 4</li>
       <li>list item 5</li>
    </ul>
    
    <script>
    $('li.third-item').next().css('background-color', 'red');
    </script>
    
    </body>
    </html>

    这个例子的结果是,只有list item 4背景色变为红色

    2、nextAll([expr]):

    获取指定元素后边的所有同级元素

    Hello
    
    Hello Again
    <div><span>And Again</span></div>
    var p_nex = $("p").nextAll();
    p_nex.addClass('p_next_all');

    注意看最后一个”<p&gt”标签哦,也被加上了’p_next_all’这个类名哦~~

    3、andSelf():

    获取指定元素后边的所有同级元素,之后加上指定的元素

    我感觉这个函数是最有意思的一个函数了,什么意思?直译过来就是”还有我“,”还有自己”,没错,还有自己。

    <p>Hello</p><p>Hello Again</p><div><span>And Again</span></div>
    var p_nex = $("p").nextAll().andSelf();
    p_nex.addClass('p_next_all');

    注意看第一个“<p>”标签啊,这句话的意思是选择p标签后面的所有同级标签,以及自己。。。

    以下这两个不举具体的例子了,实际上就是next()和nextAll()的相反喽

    4、prev():获取指定元素的上一个同级元素(是上一个哦)。

    5、prevAll():获取指定元素的前边所有的同级元素。

    var pageValue = $("#pageValue").val();
        alert("增加或者减少一页"+pageValue);
        var obj = $(".left_div_page_a_HOVER");
        $(obj).toggleClass("left_div_page_a_HOVER");
        
        if( faZ == 1 ){
            if( pageValue > 1){
                pageValue = pageValue - 1;
                obj.prev("a").toggleClass("left_div_page_a_HOVER");
            }
        }else{
            if( pageValue < 123){
                pageValue = pageValue + 1;
                obj.next("a").toggleClass("left_div_page_a_HOVER");
            }
        }
        $("pageValue").val(pageValue);
  • 相关阅读:
    【java编程】java的关键字修饰符
    【分布式锁】redis实现
    【java高级编程】JDK和CGLIB动态代理区别
    【druid 】数据库连接池
    【druid 】数据库连接池-sql解析
    【mysql】Mha实现高可用数据库架构
    【mysql】工具使用
    7.7 服务远程暴露
    7.6 服务远程暴露
    7.5 zookeeper客户端curator的基本使用 + zkui
  • 原文地址:https://www.cnblogs.com/hwaggLee/p/4525488.html
Copyright © 2020-2023  润新知