前端--初识jQuery
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的更多相关文章
- 前端07 /jQuery初识
前端07 /jQuery初识 目录 前端07 /jQuery初识 1.jquery介绍 1.1 jquery的优势 1.2 jquery是什么? 1.3 jquery的导入 2.jQuery的使用 2 ...
- 初识JQuery(1)-选择器
初识jquery 在学习jquery之前,就有看过一些相关的视频,才知道它是可以写很少的代码就可以完成很多事的.记得第一写轮播图的时候,首先就百度了篇轮播图的实现,当时还不知道自己百度的其实不是原生的 ...
- 前端之jquery
前端之jquery 本节内容 jquery简介 选择器和筛选器 操作元素 示例 1. jquery简介 1 jquery是什么 jQuery由美国人John Resig创建,至今已吸引了来自世界各地的 ...
- 第四篇:web之前端之jquery
前端之jquery 前端之jquery 本节内容 jquery简介 选择器和筛选器 操作元素 示例 1. jquery简介 1 jquery是什么 jQuery由美国人John Resig创建,至 ...
- 【前端】:jQuery下
前言: 接上一篇博客: [前端]:jQuery上 一.jQuery属性操作 ① attr(设置或返回自定义属性值) input.select.textarea框中的内容, 可以通过attr来获取,但是 ...
- JQuery --- 第一期 (初识jQuery, JQuery核心函数和工具方法)
个人学习笔记 初识jQuery 1.我的第一个JQuery <!DOCTYPE html> <html lang="en"> <head> & ...
- (李南江jQuery+Ajax)第一章:初识jQuery
第一章:初识jQuery 一.原生的JS与jQuery的区别 <!DOCTYPE html> <html lang="en"> <head> & ...
- web标准 浏览器介绍 开发工具介绍 HTML介绍 HTML颜色介绍 规范 HTML结构详解 {前端之前端初识}
前端之前端初识 前端初识 本节目录 一 web标准 二 浏览器介绍 三 开发工具介绍 四 HTML介绍 五 HTML颜色介绍 六 规范 七 HTML结构详解 一 web标准 web准备介绍: 1. ...
- 【转】jQuery之前端国际化jQuery.i18n.properties
jQuery之前端国际化jQuery.i18n.properties 基于jQuery.i18n.properties 实现前端页面的资源国际化 jquery-i18n-properties
随机推荐
- 【ES6】最常用的es6特性(一)
参考链接: http://www.jianshu.com/p/ebfeb687eb70 http://www.cnblogs.com/Wayou/p/es6_new_features.html 1.l ...
- 算法——(5)B/B+/红黑树
1. B树——lgdN B树是平衡多路查找树,主要用于文件系统的索引. 1)定义: 对于一个度数为d的B树, 每个结点最多有d个孩子 如果根结点不是叶子结点,那它至少有两个孩子 每个非叶子结点(非根结 ...
- PAT——1062. 最简分数
一个分数一般写成两个整数相除的形式:N/M,其中M不为0.最简分数是指分子和分母没有公约数的分数表示形式. 现给定两个不相等的正分数 N1/M1 和 N2/M2,要求你按从小到大的顺序列出它们之间分母 ...
- Tomcat 安装APR的有关问题
Tomcat 安装APR的问题APR.APR-util.APR-iconv安装都正常apr安装命令:./configuremakemake install apr-util./configure -- ...
- Maven 高级应用
Maven 的高级应用主要体现在 ==依赖==,==聚合==,==继承== * 依赖 就是在当前项目的pom.xml 总引入依赖的坐标 最最经常用到的 <dependencies> < ...
- 基于oracle数据库存储过程的创建及调用
1.PLSQL编程 1.1概念和目的 PL/SQL(Procedure Language/SQL) PLSQL是Oracle对sql语言的过程化扩展 指在SQL命令语言中增加了过程处理语句(如分支.循 ...
- (二)ubuntu下安装Amd RX470驱动
0X:ADM官方下载驱动 https://www.amd.com/en/support 查看本机驱动命令 lspci | grep -i vga 选择自己的驱动 下载对应的版本 现在最新的是:amdg ...
- ionic ios 打包发布流程
1.ionic cordova resources ios 在windows下 生成ios资源包 2.拷贝ionic 项目到mac电脑 不用拷贝platforms 并解压 3.正常情况下wido ...
- promise 格式
promise执行过程(test) var arr =new Array() var obj =new Object() let p =new Promise(function(resolve,rej ...
- 延迟加载图片控件--echo.js
echo.js的github地址:https://github.com/toddmotto/echo echo是一个独立的JavaScript.轻量级的.延迟图片加载插件,echo压缩后体积不到1 ...