zoukankan      html  css  js  c++  java
  • jquery的基础知识复习(基础选择器,属性选择器,层级选择器)

      

      1.基础选择器

            

          id选择器: $("#id"), 样式选择器:$(".className"),元素选择器:$("div"),$("*") 选择页面所有的元素
          
          同时使用两种选择器例如:id和元素 $("#id,div");,这里可以加上更多例如再加上一个样式的$("#id,div,.className");,
        

         2.属性选择器

        $("div[title]") 选择含有title的div元素;$("div[title]") 选择含有title=test的div元素 $("div[title=test]") ; 选择title属性不等于test的div元素:$("div[title!=test]"),这种选择方式会将没有title属性的div也选择上。
    选择以title为te开始的div元素:$("div[title^=te]"),选择title以est结尾的div元素:$("div[title$=est]");选择title属性含有 es的div元素:$("div[title*=es]")
      
      多选择器复合使用: 选择隐藏域,含有title的属性的div,id为one,class为one的元素 $("input[type=hidden],div[title,#one,.one]") ,这样取的对象结果为并集。

        3.层级选择器

          A.选择body下的所有的div元素

            $("body div"); 请注意,这样选择的是body下的所有的子孙元素,例如div中还存在其他的div也会被选中。

          B.选择body下的子div

            $("body>div"); 请注意,这样选中的body的直接的子元素,也就是这样选择的是不包含孙元素div,区别就是加上了尖括号去掉了空格而已。

          C.选择在laber元素下一个的的input元素,

            $("laber+input"); 请注意,这样选择时,如果在htlm中存在两个laber元素,并且两个laber元素下面紧接着的都是input元素那么,这是会选中两个input元素。

          D.选择和form元素同辈的后面的所有兄弟元素

            $("form~div");这样选择的就是与form元素同级别的后面的所有div元素。

          E.选择与id为test的元素同级别的所有的div元素

            $("#test").parent().children("div");  注意:先获取该元素的父元素再获取该元素的所有的子元素中的div元素。

          

          

          

        

    怕什么真理无穷 进一寸有一寸的欢喜
  • 相关阅读:
    Vue项目入门实例
    批量生成删除表数据的SQL语句
    收集的一个可多选日期的日期插件,带日历、农历
    .net core EF,多个dbcontext时,迁移数据方法
    【NET】雪花算法
    URL地址中使用中文作为的参数【转】
    C# 继承 base
    SQL Like
    SecureCRT 8.5 配置自动记录日志
    CentOS 7下Samba服务器的安装与配置
  • 原文地址:https://www.cnblogs.com/ccbk/p/7674870.html
Copyright © 2011-2022 走看看