zoukankan      html  css  js  c++  java
  • jQuery操作(一)

    基本语法:$(selector).action() 

     寻找元素(重要的选择器和筛选器) 

         一:选择器

        1.1 基本选择器: 

          $("*")  

          $("#id")  

          $(".class")  

          $("element")  

          $(".class,p,div")   // (!!!)

        1.2 层级选择器: 

           $(".outer div")   //outer 下的所有子元素(!!!)

           $(".outer>div")  //outer 的子代(不包括孙代)

           $(".outer+div") //outer 子代毗邻的元素(如果有多个,选择最后面那个,必须是毗邻的)

           $(".outer~div") //outer 向下的不一定毗邻的子代元素

        1.3 基本筛选器:

          $(".outer li:first") //第一个元素

            $(".outer li:eq(2)")  //元素 id 等于2(从0开始)

          $(".outer li:even") //奇数位置元素

          $(".outer li:gt(1)") //id 大于1的元素

        1.4 属性选择器:

          $('[id="div1"]')

            $('["name="Tom"][id]')

        1.5 表单选择器:

            $("[type='text']")----->$(":text")   //注意只适用于input标签

          $("input:checked")      

       二:筛选器

        2.1 过滤筛选器:(同基本选择器,只是写法不同)

          $("li").eq(2)

            $("li").first()

            $("ul li").hasclass("test") //返回判断值

        2.2 查找筛选器:

          //子类继承父类,css()样式跟着变化

           2.2.1

             $("div").children(".test")   //只查找子代标签

             $("div").find(".test")       //查找所有后代标签

            2.2.2 (向下找)

             $(".test").next()            //同一层挨着下一个标签(兄弟层)

             $(".test").nextAll()        //同一层下面所有

             $(".test").nextUntil()     //同一层找到截止到某个位置的所有标签;   $(".test").nextUntil(".div6"),  找到下面截止到".div6"位置之前的标签(不包含. div6)

                     2.2.3 (向上找,2.2.2)

             $("div").prev()

             $("div").prevAll()  

             $("div").prevUntil()

     

            2.2.4

                 $(".test").parent()     //向上找到父代

            $(".test").parents()       //向上一直找父代,直到 body

            $(".test").parentUntil()    //向上找父代直到某一层,不包含该层父代 

     

            2.2.5

            $("div").siblings()     //找到兄弟层的所有标签(向上向下)

     

      

      获取多个标签

        // 获取多个标签
    
        function func1(self) {
          $(self).parent().parent().children(".shade, .model").addClass("hide")
        }

                     

  • 相关阅读:
    web常用自动化库——selenium总结(转)
    前端框架面试题
    SpringBoot整合Knife4j展示更美观的API文档
    JUC- ThreadLocal学习笔记
    JUC-ThreadPool线程池的使用与学习
    Java8 新特性
    SpringBoot 整合FreeMarker进行邮件发送
    IDEA 打开别人的项目的是Maevn插件依赖出错问题处理
    Liunx常用指令备查
    第四次作业
  • 原文地址:https://www.cnblogs.com/jiefangzhe/p/8576795.html
Copyright © 2011-2022 走看看