• jQuery--基础(查询标签)


    浅谈jQuery使用背景

            jQuery是使用原生js写成的一个库,使用简单,提高开发效率。在用js冗杂的代码解决的问题中,大部分都可以用jQuery来快速解决。

            例如:

            js中查询网页中ID为"d1"的标签是这样的

    document.getElementByID("d1")

           但是在引用了jQuery库后,代码是这样的

    $("#d1")

       事实显而易见,jQuery要比原生js简洁很多

    jQuery引用方法

       1. 直接下载文件,然后放到目录下,src指向该文件
          2. CDN <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> 必须联网

           在jQuery中,引用方法类似python中的引用类方法,jQuery.xxx不过在这里一律使用$来替代jQuery

    jQuery基础:

      和原生js一样,jQuery的使用准则仍然是先查询到标签再对标签进行操作,所以查询标签依然是最重要的一点

      选择器

              id选择器: $("#id值")
              class选择器: $(".c1")
              大包大揽选择器:$("*")
              标签名选择器: $("div") $("a") $("p")
              组合选择器:$("#i1, p")

      jQuery对象

              DOM对象转换成jQuery对象
              ele --> $(ele)
            
              jQuery对象转换成DOM对象
              $ele --> $ele[index]
            
              *jQuery对象赋值给变量的时候,变量名最好以$开头,方便区分

              jQuery对象:
              DOM对象转换成jQuery对象
              ele --> $(ele)
            
              jQuery对象转换成DOM对象
              $ele --> $ele[index]
            
              jQuery在使用DOM方法时候一定要转换成DOM对象

        DOM对象要使用jQuery方法时候一定要转换成jQuery对象

      层级选择器

              层级下所有子代选择器: $("选择器1 空格 选择器2")
              层级下一层子代选择器:     $("选择器1 > 选择器2")
              毗邻选择器:     $("选择器1+选择器2")
              下位兄弟选择器:     $("选择器1~选择器2")

      筛选器

        筛选器内都是在("")里面

        使用方法    (":方法")

        参考方法地址:http://jquery.cuishifeng.cn/find.html

      属性选择器

              $("input[type='text']")  --> 注意:双引号里面用单引号

      表单选择器

        具体使用方法同筛选器,只能使用表单内的type,查询地址同上

      筛选器

                 和上面的区别:上面的是写在引号里面的
              这个是作为方法来使用的
            
              * 括号里面都可以加选择器条件
            
              往后找:     
                  .next()
                  .nextAll()
                  .nextUnitl()
                
              往前找:
                  .prev()
                  .prevAll()
                  .prevUntil()
                
              往外层找:
                  .parent()
                  .parents()
                  .parentsUntil()
            
              查找方法:
                  .find()
                    
            
              后代选择器: .children()
              兄弟选择器: .siblings()

        补充:
        
              not:
                  写在引号里面的:        --> $("#my-checkbox input:not(:checked)")
                  写在外面当方法用的      --> $("#my-checkbox input").not(":checked")
                
              has:
                  写在引号内表示有什么的  --> $("label:has('input')")
                  写在外面当方法用的:    --> $("label").has("input")

          具体多种方法查询依然遵循上述地址

      

  • 相关阅读:
    springcloud 学习笔记
    一文领悟HTTPS密钥为什么这样传输
    静态代码扫描工具PMD参数过程简介与JCommander 以及如何扩展
    静态代码扫描工具PMD分析XML的核心源码解读(从core主入口到子语言解析)
    Jenkins出现SVNException:E175002
    一个第三方登录的流程
    爬虫入门(三)爬取b站搜索页视频分析(动态页面,DBUtils存储)
    09 元素等待机制
    测试观点
    什么是请求
  • 原文地址:https://www.cnblogs.com/gaoshengyue/p/7840611.html
Copyright © 2020-2023  润新知