zoukankan      html  css  js  c++  java
  • [ jquery 过滤器nextAll(expr) ] 此方法用于在选择器的基础之上搜索被选元素的后面的所有同级元素,此方法参数只能传递表达式,无法传递其他类型

    此方法用于在选择器的基础之上搜索被选元素的后面的所有同级元素,此方法参数只能传递表达式,无法传递其他类型

    可以使用此方法向里面传递表达式的方法实现和jqueryObj.next()相同的效果

    实例:

    <html lang='zh-cn'>
    <head>
    <title>Insert you title</title>
    <meta http-equiv='description' content='this is my page'>
    <meta http-equiv='keywords' content='keyword1,keyword2,keyword3'>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type='text/javascript' src='./js/jquery-1.12.1.min.js'></script>
    <style type="text/css">
        *{margin:0;padding:0;}
        html{font:400 15px/1.2em 'Courier New';color:#666;750px;margin:25px auto;}
        div > p{white-space: pre-wrap;margin:15px 0;}
        div >*{text-indent:8px;}
        .hover{color:#FF96EC;}
    </style>
    <script type='text/javascript'>
        $(function(){
           $('div').nextAll('.selectorDemoSecond').addClass('hover');
        });
    </script>
    </head>
    <body>
        <div id='demo'>
            <p>This is a p tag text presentation.</p>
            <p>This is a p tag text presentation.</p>
            <p>This is a p tag text presentation.</p>
            <div class='selectorDemoFirst' style='border:1px solid #925CE9;'>
                <p>This is a p tag text presentation.</p>
                <p>This is a p tag text presentation.</p>
            </div>
            <p>This is a p tag text presentation.</p>
            <div class='selectorDemoSecond' style='border:1px solid #999;margin-bottom: 45px;'>
                <span>This is a span tag text presentation</span>
                <p>This is a p tag text presentation.</p>
            </div>
            <div class='selectorDemoSecond' style='border:1px solid #925CE9;'>
                <span>This is a span tag text presentation</span>
                <p>This is a p tag text presentation.</p>
                <span style='padding:8px;'>This is a span tag text presentation</span>
            </div>
            <p>This is a p tag text presentation.</p>
        </div>
    </body>
    </html>
  • 相关阅读:
    react 安装脚手架过程
    微信小程序-分享功能
    echarts 实现多图联动显示tooltip
    dom 相同父节点查找
    js 给你一个 32 位的有符号整数 x ,返回将 x 中的数字部分反转后的结果
    vue手写el-form组件
    vue组件传值、通信
    vue项目打包桌面应用 exe程序 以及打包为安装程序exe
    vue 使用echarts来制作图表
    前端数据可视化插件-图表
  • 原文地址:https://www.cnblogs.com/mysearchblog/p/5616999.html
Copyright © 2011-2022 走看看