zoukankan      html  css  js  c++  java
  • jQuery筛选--hasClass(class)和eq(index|-index)

       hasClass(class)

    概述

        检查当前的元素是否含有某个特定的类,如果有,则返回true

    参数

        class  用于匹配的类名

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
            <script type="text/javascript">
                $(document).ready(function(){
                    $("p").click(function(){
                        //hasClass(class)检查当前的元素是否含有某个特定的类,如果有,则返回true
                        if($(this).hasClass("paragraph")){
                            $(this).css("color","#0000FF");
                        }
                    });
                });
            </script>
            <style type="text/css">
                .paragraph{
                    color:#FF0000;
                }
            </style>
        </head>
        <body>
            <p class="paragraph">第一个段落。</p>
            <p>第二个段落。</p>
        </body>
    </html>

       eq(index|-index)

    概述

        获取当前链式操作中第N个jQuery对象,返回jQuery对象,当参数大于等于0时为正向选取,比如0代表第一个,1代表第二个。当参数为负数时为反向选取,比如-1为倒数第一个

    参数

        index  一个整数,指示元素基于0的位置,这个元素的位置是从0算起;-index  一个整数,指示元素的位置,从集合中的最后一个元素开始倒数。(-1算起)

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
            <script type="text/javascript">
                $(document).ready(function(){
                    $("p").eq(0).css("color","#FF0000");
                    $("p").eq(1).css("color","#0000FF");
                    $("p").eq(-1).css("color","#FF0000");
                });
            </script>
        </head>
        <body>
            <p>第一个段落。</p>
            <p>第二个段落。</p>
            <p>第三个段落。</p>
        </body>
    </html>
  • 相关阅读:
    dsoframer设计笔记
    pb 使用ole控制进行WORD操作失败-9
    【学习笔记】Fragment
    Suggest:the suffix for classes name
    ArrayList和LinkedList
    Android Studio入门
    asp.net ToString() 输出格式详细
    Uploadify 3.2 参数属性、事件、方法函数详解
    基础解析正则表达式
    10个优秀的 Web UI库/框架
  • 原文地址:https://www.cnblogs.com/fengfuwanliu/p/10078122.html
Copyright © 2011-2022 走看看