zoukankan      html  css  js  c++  java
  • JQuery选择器--------没有它就没有页面效果

      今天你,我给大家带来的是JQuery选择器的一些知识,希望对大家的学习有些帮助!

    什么是jquery选择器?�
    概念�允许的多个元素组或单个元素进行操作从而找出想要的元素。

    几种jquery选择器的介绍�
    一、基本选择器
    1、 Id选择器
    功能�根据匹配的ID匹配一个元素
    示例:$(“#id”)
    2、 class选择器

    功能�根据给定的类匹配元素。
    示例�$(“.class”)
    3、*
    功能�匹配所有元素。
    示例�$(“*”)
    4、element
    功能�根据给定的元素名匹配所有的元素。
    示例�$(“div”) 查找所有的div
    5、组选择器
    功能�将每一个选择器匹配到的元素合并后一起返回。
    示例�$(“table tr td”)

    二、层级选择器
    1、 ancestor descendant
    功能�在给定的祖先元素下匹配所有的后代元素
    示例�$(“div span”)
    2、 选取子元素
    功能�在给定的父元素下匹配所有的子元素
    示例�$(“div>span”)
    3、 prev+next
    功能�匹配所有进阶在prev后的下一个元素�紧邻�
    示例�$(“#one+div”)
    4、~
    功能�匹配选定的操作符后所有兄弟元素
    示例�$(“#one~div”)

    三、属性选择器

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>上机练习-1</title>
        <script src="js/jQuery1.11.1.js"></script>
        <script type="text/javascript">
            $(function ()
            {
                $("p").click(function ()
                {
                    $("[class=txt_box]>[class=current]").css("background", "#6FF")
                    $("p>span").css("background", "#F9F")
                    $("h1+p").css("background", "#F06")
                    $("strong~span").css("color","#00C")
                })
            })
    
        </script>
    </head>
    <body>
        <h1>英雄联盟</h1>
        <p>
            《英雄联盟》,简称lol。
        </p>
        <p><strong>Riot Games</strong>开发, 为3D竞技场站游戏, 其<span>主创团队由实力强劲的
            <strong>魔兽争霸</strong>
            系列游戏多人即时对战自定义地图开发团队
            </span>...
            <a href="#">更多详情</a>
        </p>
        <h2>目录</h2>
        <ul class="txt_box">
            <li class="current">开发团队</li>
            <li>游戏周边</li>
            <li>游戏介绍</li>
            <li>配置需求</li>
            <li>游戏背景</li>
        </ul>
    </body>

    单击<p>元素后,根据下图设置元素的背景颜色、文本颜色属性。

    单击后如图所示:

    通过条件过滤选取元素

    1.基本选择器

    2.可见性过滤选择器

  • 相关阅读:
    Flink SQL Client初探
    ansible快速部署cassandra3集群
    利用TfidfVectorizer进行中文文本分类(数据集是复旦中文语料)
    spark读取HDFS目录时报错Failed on local exception: com.google.protobuf.InvalidProtocolBufferException
    Spark学习进度-Spark环境搭建&Spark shell
    jquery获取select选中的值
    java零基础到架构师学习线路(附视频教程)
    plsql连接远程oracle数据库
    如何在通用异常处理时获取到方法名称(获取注解参数JoinPoint)
    java:找不到符号(使用lombok)
  • 原文地址:https://www.cnblogs.com/wth1129/p/5513753.html
Copyright © 2011-2022 走看看