jQuery

一.jQuery介绍

1.jQuery是一个轻量级.兼容多浏览器的js库.

2.jQuery使用户能够更方便地处理HTML Document,Events,实现动画效果,方便的进行Ajax交互,能够极大的简化js编程,它的宗旨就是"Write less,do more."

- 版本
- 1.x
兼容IE8。。。
- 3.x
最新
- .min.xx
压缩的:生产环境用
- 没有压缩的(没有.min.xx):开发用

二.为什么要用jQuery?

写起来简单,省事,开发效率高,兼容性好

三.什么是jQuery?

jQuery是一个兼容多浏览器的js库(类似于python中的模块)

四.如何使用jQuery?

1.导入<script src = "jquery-3.3.1.js"></script>或者<script src = "jquery-3.3.1.min.js"></script>

2.语法规则:$(" ")

五.js和jQuery的区别?

jQuery就是js写的

js是基础,jQuery是工具

六.选择器:

1.基础选择器

  --ID选择器                        $("#id的值")

  --类选择器(class)             $(".class的值")

  --标签选择器(html标签)    $("标签的名字")

  --所有标签                      $("*")

  --组合选择器                     $("xx,xxx")

2.层级选择器

  --从一个标签的子子孙孙去找                       $("父亲    子子孙孙")

  --从一个标签的儿子里找                              $("父亲>儿子标签")

  --从紧挨着的标签(毗邻标签)                        $("标签+下面紧挨着的那个标签")

  --找后面所有同级的                                     $("标签~兄弟")

七.jQuery对象:

  --用jQuery选择器查出来的就是jQuery对象

  --如果是jQuery对象,它可以使用jQuery方法,不能使用DOM的方法

  --DOM对象和jQuery对象转换:

    --$(".c1")[0] ----> DOM对象

    --$(DOM对象)

八.筛选器

  --写在引号里面的

    基本筛选器

      $("    :first")             找第一个

      $("    :not(' ')")         不是/非

      $("    :even")           偶数

      $("    :odd")             奇数

      $("    :eq(index)")    找等于index的

      $("    :gt(index)")     找大于index的

      $("    :lt(index)")      找小于index的

      $("    :last")             最后一个

      $("    :focus")          焦点

      内容==========

        $(".c1:contains('我是第一个')")          包含文档的内容的标签

        $("    :empty")                                    标签内容为空的

        $("    :has(' ')")                                   包含标签的标签

        $("    :parent")                                    找有孩子的父亲

        $(" #i7").parent                                  找i7的父亲

      可见性==========

        $("    :hideen")              找到隐藏的

        $("    :visible")               找不隐藏的,也就是显示的

      属    性==========

        input[name]    ---->    找有name属性的input

        input[type = "password"]    ---->    类型是password的input标签

      表    单==========

        :input

        :password

        :checkbox

        :radio

        :submit

        :button

        :image

        :file

      表单对象属性======

        :enable           可选的

        :disable          不可选的

        :checked        选中的

        :selected        下拉框选中

    --写在信号外面当方法用的

      过    滤==========

        $("  ").first()        找第一个

        $("  ").parent()    找父亲

        $("  ").eq(index)  找等于index的

        .hasClass()         判断有没有某个类的

      查    找==========

        .children()          找孩子

        .find()                 查找

        .next()                下面的

        .nextAll              下面所有的

        .nextUntil()         直下面的直到找到某个标签

        .parent()             找父亲

        .parents()            找所有的父亲

        .parentsUntil()     直到找到你要找的那个父亲为止

        .prev()                 上面的

        .prevAll()             上面的所有

        .prevUntil()          上面的直到找到某个标签为止

        .siblings()             所有的兄弟

----toggleClass()                切换|开关:有就移除,没有就添加

----addClass("hide")           添加类

----removeClass("hide")     删除类

注:

1)

2)

3)

前端--初识jQuery的更多相关文章

  1. 前端07 /jQuery初识

    前端07 /jQuery初识 目录 前端07 /jQuery初识 1.jquery介绍 1.1 jquery的优势 1.2 jquery是什么? 1.3 jquery的导入 2.jQuery的使用 2 ...

  2. 初识JQuery(1)-选择器

    初识jquery 在学习jquery之前,就有看过一些相关的视频,才知道它是可以写很少的代码就可以完成很多事的.记得第一写轮播图的时候,首先就百度了篇轮播图的实现,当时还不知道自己百度的其实不是原生的 ...

  3. 前端之jquery

    前端之jquery 本节内容 jquery简介 选择器和筛选器 操作元素 示例 1. jquery简介 1 jquery是什么 jQuery由美国人John Resig创建,至今已吸引了来自世界各地的 ...

  4. 第四篇:web之前端之jquery

    前端之jquery   前端之jquery 本节内容 jquery简介 选择器和筛选器 操作元素 示例 1. jquery简介 1 jquery是什么 jQuery由美国人John Resig创建,至 ...

  5. 【前端】:jQuery下

    前言: 接上一篇博客: [前端]:jQuery上 一.jQuery属性操作 ① attr(设置或返回自定义属性值) input.select.textarea框中的内容, 可以通过attr来获取,但是 ...

  6. JQuery --- 第一期 (初识jQuery, JQuery核心函数和工具方法)

    个人学习笔记  初识jQuery 1.我的第一个JQuery <!DOCTYPE html> <html lang="en"> <head> & ...

  7. (李南江jQuery+Ajax)第一章:初识jQuery

    第一章:初识jQuery 一.原生的JS与jQuery的区别 <!DOCTYPE html> <html lang="en"> <head> & ...

  8. web标准 浏览器介绍 开发工具介绍 HTML介绍 HTML颜色介绍 规范 HTML结构详解 {前端之前端初识}

    前端之前端初识   前端初识 本节目录 一 web标准 二 浏览器介绍 三 开发工具介绍 四 HTML介绍 五 HTML颜色介绍 六 规范 七 HTML结构详解 一 web标准 web准备介绍: 1. ...

  9. 【转】jQuery之前端国际化jQuery.i18n.properties

    jQuery之前端国际化jQuery.i18n.properties 基于jQuery.i18n.properties 实现前端页面的资源国际化 jquery-i18n-properties

随机推荐

  1. JQuery资源网站(收藏)

    收藏几个不错的JQuery资源网站,以后备用,给共享者点个赞!!! http://jquery.com/ http://www.htmleaf.com/ http://www.oschina.net/ ...

  2. PAT——1023. 组个最小数

    给定数字0-9各若干个.你可以以任意顺序排列这些数字,但必须全部使用.目标是使得最后得到的数尽可能小(注意0不能做首位).例如:给定两个0,两个1,三个5,一个8,我们得到的最小的数就是1001555 ...

  3. [LuoguP1034][Noip2002] 矩形覆盖

    [LuoguP1034][Noip2002] 矩形覆盖(Link) 在平面上有\(N\)个点,\(N\)不超过五十, 要求将这\(N\)个点用\(K\)个矩形覆盖,\(k\)不超过\(4\),要求最小 ...

  4. Hibernate工作原理及为什么要用?. Struts工作机制?为什么要使用Struts? spring工作机制及为什么要用?

    三大框架是用来开发web应用程序中使用的.Struts:基于MVC的充当了其中的试图层和控制器Hibernate:做持久化的,对JDBC轻量级的封装,使得我们能过面向对象的操作数据库Spring: 采 ...

  5. 结构体 内存对齐 keil & STM32

    直接 上图 不废话: 第二张图:  把16位 类型的数据 换成 数组 ,这样 达到 节约内存和  方便处理  缓冲区数据

  6. webapi中的模型验证

    mic: https://docs.microsoft.com/en-us/aspnet/web-api/overview/formats-and-model-binding/model-valida ...

  7. [转载]Linux crontab命令解析

    名称 : crontab crontab 是用来让使用者在固定时间或固定间隔执行程序之用,换句话说,也就是类似使用者的时程表.-u user 是指设定指定 user 的时程表,这个前提是你必须要有其权 ...

  8. exynos4412—链接脚本复习

    在u-boot下,定义变量, 编译,编译完后  使用arm-linux-nm arm    没有去头的二进制可执行文件 都在BSS段,均为初始化. 打印之后会出算随机值. 目前还处于uboot阶段,如 ...

  9. python 消息队列-rabbitMQ 和 redis介绍使用

    1.rabbitMQ 与ptyhon 进程queue 区别.进程queue 主要用户Python父子进程之间或者统一进程不同子进程.rabbit可以用户不同语言之前的相互交流,socket可以实现同样 ...

  10. restful api编写规范

    Node.js 除了用来编写 WEB 应用之外,还可以用来编写 API 服务,我们在本文中会介绍编写 Node.js Rest API 的最佳实践,包括如何命名路由.进行认证和测试等话题,内容摘要如下 ...