简单的学习一下jQuery的入门知识

本文深入讲解了jQuery的基础事件处理、语法、DOM操作、动画效果及Ajax应用,详细介绍了各种方法如click、fadeIn、append等的使用场景,以及如何通过jQuery简化DOM操作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、jQuery的事件
$(document).ready(function){}:将函数绑定到文档的就绪事件中
$(selector).click(function):触发或将函数绑定到被元素的点击事件中
$(selector).dbclick(function);触发或将函数绑定到被选元素的双击事件中
$(selector).focus(function):触发或将函数绑定到被选元素的获到焦点事件中
$(selector).mouseover(function)触发或将函数绑定到被选的鼠标悬停事件中
2、jQuery语法
$(this).hide:隐藏当前元素
$(“p”).hide :隐藏所有的段落
$(".test").hide :隐藏所有class=“test’的左右元素
$("#test").hide:隐藏所有id=test的元素
jQuery.toggle():通过jquery,你可以使用toggle()方法来切换隐藏和显示的属性
淡出淡入的效果
.fadeIn():淡入的效果
.fadeOut():淡出的效果
.fadeToggle():淡出淡入的效果
.fadeTo():设置为给定的不透明度
jquery的滑动的效果图
.slideDown():是向下拉
.sildeUp():是向上拉
.sildeToggle:是向上拉或者是向下拉相互切换
jqueryd的动画
.animate({当中有很多的属性})
jquery dom的操作
jquery 提供一系列的与DOM相关的能力,这使访问和操作元素和属性变得很容易

W3C 文档对象模型程序和脚本动态访问和跟新文档的内容,结构以及样式
1、获取内容-text()、html()、val()
text()-设置获返回文本所选的元素内容
html()-设置放回所选内容(Html标记)
val()-设置或返回表单字段的值。
.attr(“属性”)-显示是属性的值

例:

无标题文档

网站显示属性值

显示href的属性值 运行结果为:![在这里插入图片描述](https://img-blog.csdnimg.cn/20190314162009393.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2dkX3pjaw==,size_16,color_FFFFFF,t_70) ***jquery中的添加方法*** jquery.append():再被选元素的结尾插入内容 jquery.prepend():再被选元素的开头插入内容 jquery.after():在被选元素之后插入内容 jquery.before();在被选元素之前插入内容 **jquery中的css的使用方法** addclass;向被选元素添加一个或多个类 removeclass;从选中的元素中删除一个类或多个类 toggleClass()对被选中的元素进行添加和删除的切换的操作 css():设置或返回样式的属性(或是返回被选元素的UI个或多个样式的属性) **jquery中遍历** 所谓遍历就是“移动”,用于根据其相对应于其他元素的关系来“查找”(或选取html的元素)。从某项开始,并沿着这个选择移动,直到抵达你期望的元素为止。 **祖先** jquery的parent的方法的作用 :对于返回元素的直接父亲元素,该方法只会向上一级对dom树进行遍历 jquery的oarents的方法的作用 :parents是多余返回元素的所有的祖先的元素的搜索,他可以一路向上直到文档搜索 jquery的parentsUntil的方法是 :介于两个元素之间的所有祖先的类进行搜索。 **后代** .chlidren()方法:返回被选元素的所有的直接的子元素,该方法只会想下一级对dom进行遍历 .find()方法:返回被选元素的后代元素,该方法会一直到最后一个子代 **JQuery和Ajax** ajax=异步的javaScript和xml 简短的说:在不加载网页的情况下,ajac通过后台加载数据,并在网页上显示。 通过jquery ajax的方法,你能够用Http get 和http post的方法从远程的服务器请求文本,html。xml。json-同事你能购把这写数据直接载入网页的被选元素中 **HTTP请求:get vs post** get基本上用于从服务器获得(取回数据),注释:GET方法可能返回缓存数据 post 也可以从服务器获取数据。不过,post方法不会缓存数据,并且不会缓存数据,并且常用于连同请求一起发给数据 $.get()方法:通过http get 请求从服务器上请求数据。 语法:$.get(url,callback); url:参数是请求成功后的所执行的函数名。 callback参数:是请求成功后所执行的函数名。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值