zoukankan      html  css  js  c++  java
  • jQuery 介绍

    jquery对象和dom对象

    1 jquery找到的标签对象称为 -- jquery对象
    2 原生js找到的标签对象称为 -- dom对象
    3 dom对象只能使用dom对象的方法,不能使用jquery对象的方法
    4 jquery对象也是,它不能使用dom对象的方法
    5 
    6 dom对象和jquery对象互相转换:
    7     jquery对象转dom对象 -- jquery对象[0]  示例:$('#d1')[0]
    8     dom对象转jquery对象 -- $(dom对象)

    jQuery选择器

    基本选择器

     1 jQuery('#d1')  -- $('#d1')
     2 基本选择器(同css)
     3       id选择器:
     4 
     5     $("#id")  #不管找什么标签,用什么选择器,都必须要写$(""),引号里面再写选择器,通过jQuery找到的标签对象就是一个jQuery对象,用原生JS找到的标签对象叫做DOM对象,看我们上面的jQuery对象部分的内容
     6       标签选择器:
     7 
     8     $("tagName")  $('div')
     9       class选择器:
    10 
    11     $(".className")  
    12       配合使用:
    13 
    14     $("div.c1")  // 找到有c1 class类的div标签
    15       所有元素选择器:
    16 
    17     $("*")
    18       组合选择器:
    19 
    20     $("#id, .className, tagName")
    21 
    22     选择器找到的可能是多个标签,会放到数组里面,但还是jquery对象,能够直接使用jquery的方法,意思是找到的所有标签进行统一设置,如果要单独设置选中的所有标签中的某个标签,可以通过索引取值的方式找到,然后注意,通过索引取值拿到的标签,是个dom对象

    基本筛选器

     1 <ul>
     2     <li>蔡世楠</li>
     3     <li>尤利阳</li>
     4     <li id="l3">张雷</li>
     5     <li>申凯琦</li>
     6     <li id="l5">程德浩</li>
     7     <li>罗新宇</li>
     8     <li>曾凡星</li>
     9 </ul>
    10 
    11 :first  -- 示例:$('li:first') // 第一个
    12 :last // 最后一个
    13 :eq(index)// 索引等于index的那个元素    支持负数$('li:eq(-1))
    14 :even // 匹配所有索引值为偶数的元素,从 0 开始计数
    15 :odd // 匹配所有索引值为奇数的元素,从 0 开始计数
    16 :gt(index)// 匹配所有大于给定索引值的元素
    17 :lt(index)// 匹配所有小于给定索引值的元素
    18 :not(元素选择器)// 移除所有满足not条件的标签
    19 :has(元素选择器)// --$('li:has(.c1)')  找到后代中含有满足has里面选择器的那个标签
    20 :not(:has(.c1)) -- $('li:not(:has(.c1))') 排除后代中含有满足has里面选择器的那个标签

    属性选择器

     1 [attribute]
     2 [attribute=value]// 属性等于
     3 [attribute!=value]// 属性不等于
     4 
     5 // 示例,多用于input标签
     6 <input type="text">
     7 <input type="password">
     8 <input type="checkbox">
     9 $("input[type='checkbox']");// 取到checkbox类型的input标签
    10 $("input[type!='text']");// 取到类型不是text的input标签

    表单筛选器

    1 找到的是type属性为这个值的input标签中
    2 :text
    3 :password
    4 :file
    5 :radio
    6 :checkbox
    7 :submit
    8 :reset
    9 :button

    表单对象属性筛选器 1 :enabled #可用的标签 2 :disabled #不可用的标签 3 :checked #选中的input标签 4 :selected #选中的option标签 

  • 相关阅读:
    03_02_leetcode_11_盛最多的水
    03_01_跳跃表
    初学Java算法编程_Array List自己和官方文档的区别
    编译原理习题解析-第1章
    VS2019配置C+++mingW32配置
    自创理解绝对定位和相对定位的方法
    Solution -「洛谷 P7395」「CoE-I 2021C」弹珠游戏
    Solution Set -「ARC 113」
    Solution Set -「ABC 192」
    Solution Set -「CF 1486」
  • 原文地址:https://www.cnblogs.com/ch2020/p/12989955.html
Copyright © 2011-2022 走看看