分享更有价值
被信任是一种快乐

jQuery应用方法是什么

文章页正文上

这篇文章主要介绍“jQuery应用方法是什么”,在日常操作中,相信很多人在jQuery应用方法是什么问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”jQuery应用方法是什么”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!一 认识jQueryjQuery是JavaScript Query的缩写形式。jQuery是一款非常优秀的JavaScript库,即便是MVVM框架盛行的今天,也有超过半数的网页及应用直接或间接的使用了jQuery。jQuery的设计理念是“Write Less, Do More“,即写的更少,做的更多!使用jQuery可以大大简化我们的JS代码,从而提高开发效率。jQuery现在有3个大的版本,分别是1.x,2.x,3.x。你可以从jQuery官方网站下载需要的版本,然后从本地引入到自己的项目,也可以使用CDN引入。在你下载jQuery时一般有两个可选的版本,一个是压缩版(不包含换行和空格,体积更小,多用于实际项目开发),另一个是未压缩版(包含换行和空格,体积稍大,多用于学习和测试)。另外,jQuery从第二个大的版本开始,为了优化网络响应和使语法更加简洁,抛弃了对IE6、7、8的支持,并且从2.1.0开始,压缩版本的文件中也不再包含注释信息了。为了获得更好的兼容性,我们这里使用的jQuery文件版本号是1.12.4。二 jQuery核心1,$符号jQuery实际上是一个函数对象。事实上,jQuery通过全局变量jQuery引用该函数对象,$符号是jQuery变量的一个别名,为了写的更少,我们通常都使用$符号表示该对象。如果你还使用了其他框架,或自定义了$变量,那么有可能和jQuery的$符号造成冲突。在使用jQuery编程之前,首先调用noConflict()方法,解除jQuery对$符号的占用,这样就可以解决这一问题了。但往后就只能通过变量jQuery来使用jQuery的所有功能了。2,参数$核心函数可以接收3种类型的参数,分别是函数引用、字符串、DOM对象。a) 接收一个函数这种方式类似原生JS的window.DOMContentLoaded方法,只要HTML文档解析完毕并生成DOM tree就会触发该事件。但是在jQuery中可以同时存在多个该方法。b) 接收字符串c) 接收DOM元素如果核心函数接收一个DOM元素,那么它会把该DOM元素包装成一个jQuery对象,并返回。jQuery对象事实上是一个类数组,保存了获取到的DOM元素。只有通过jQuery对象才可以访问jQuery提供的属性和方法。3,静态方法jQuery提供了一些静态方法,例如遍历数组,字符串去空格,判断数据类型等等,这些方法在ES5之前都是很实用的方法,但ES5之后,原生JS就已经实现了这类似的方法,所以这里就不再详细讲解了,有兴趣可以自行查看官方文档。jQuery把ajax相关操作也封装为静态方法,稍后会专门讲解。这里要讲的只有holdReady方法。三 jQuery 属性和节点1,选择器选择器是jQuery的核心功能。绝大多数css支持的选择器都可以在jQuery得到支持。通过核心函数获取到的DOM元素都被包装成jQuery对象,以类数组的形式存储。我们可以通过eq方法获取其中某一个,还可以通过get方法获取DOM对象。1另外jQuery还提供了一些通过层级结构查找元素的方法。2,属性操作获取DOM元素之后,jQuery把它们包装成jq对象,然后你就可以通过jQuery提供的方法修改相应的DOM元素了,包括CSS,文本,属性节点,HTML结构等等。属性及属性节点相关:当属性没有被显示的设置时,通过attr()方法获取将返回undefined,而prop()方法可以返回true或者false,所以,如果你要检索和更改DOM属性,比如元素的checked,selected,或disabled状态,推荐使用prop()方法,其他时候都使用attr方法。注意,使用上诉方法获取属性值时,返回的只是第一个匹配的DOM元素的相应属性值。但是设置的时候却是为所有匹配的DOM元素都添加该属性。class类相关:文本及结构相关:我是段落css相关:尺寸及位置相关:3,节点jQuery也提供了节点的增、删、改、查相关方法。HelloHelloHelloHello四 jQuery 事件1,事件绑定和移除jQuery提供了两种绑定事件的方式,第一种是on+事件名称的具体事件方法,第二种是直接使用on方法。jQuery的事件绑定类似原生JS的addEventListener方法,可以同时绑定同一类型的多个事件,而不会相互覆盖。jQuery通过off方法解除事件绑定。2,阻止事件冒泡和默认行为使用jQuery阻止事件冒泡和默认行为与原生JS一样。不太清楚的可以查看我的《DOM之事件(一)》。3,一次性事件和自动触发事件通常我们给元素绑定的事件处理程序需要特定的事件才能触发,比如click,mouseover等等,jQuery提供了triggerHandler方法,你可以通过该方法手动触发元素绑定的事件处理程序,而不用等到特定事件发生。jQuery还提供了另一个方法:trigger。它的功能和trigg免费云主机、域名erHandler方法一样。他们的不同之处在于triggerHandler不会触发事件的默认行为和冒泡。4,事件委托jQuery通过delegate方法实现事件委托。该方法使用上和原生JS有一些区别,原生JS实现事件委托也请移步《DOM之事件(一)》。五 jQuery 动画1,显示和隐藏jQuery通过show方法和hide方法实现元素的显示和隐藏。它的原理是修改元素的display和宽高及opacity属性。这两个方法还可以接受一个回调函数作为第二个参数,用于设置动画完成后需要执行的操作。2,展开和收起jQuery通过slideDown,slideUp实现平缓的展开和收起元素。该方法是通过高度变化(向下增大或减小)来动态地显示元素,在显示完成后可选地触发一个回调函数。展开后收起动画常用来做下拉菜单。3,淡入淡出jQuery通过fadeIn和fadeOut实现淡入淡出效果。该方法的原理是修改元素的opacity属性,不会改变元素的宽高。也可接收一个回调函数。4,自定义动画jQuery通过animate方法实现自定义动画效果。注意,jQuery的动画采用队列形式,每编写一个动画,就向动画队列中插入一个,只能等前面的执行完后才执行后面的。5,停止和延迟jQuery的stop方法可以暂停正在执行的动画。介于jQuery通过队列形式控制动画执行,我们建议在调用jQuery动画之前都先调用一次stop方法,以免造成动画混乱。jQuery通过delay延迟动画的执行。$(‘div’).animate({width:200px;height:200px;},1000).delay(1000).animate({background-color:red;},1000);//在改变宽高后等待1000ms再改变背景颜色
六 jQuery AjaxjQuery封装了功能完整的Ajax方法,我们常用的jQuery方法有3个,分别是$.ajax()、$.get()、$.post()。1,ajax()方法ajax方法接收一个对象作为参数,对象的属性名为ajax的设置参数,属性值为ajax的设置值。常用的参数有:type:请求类型,可选值有post和get。url:发送请求的地址。data:发送到服务器的数据。必须是“key0=value0&key1=value1“或键值对的形式(对象)。cache:规定是否读取缓存数据,true表示读取,false表示不读取,直接从服务器获取。dataType:期望服务器返回的数据类型,可选值有xml,html,script,json,text。success:ajax请求成功回调函数。error:ajax请求失败回调函数。使用ajax()方法时,所有的设置参数都是可选的,除了上诉参数外,还有很多其他的参数可选,这让我们在通过jQuery实现ajax时有了更大的灵活性。如果你想了解更多相关参数的信息,请到jQuery官网查询。2,get()方法如果你觉得ajax()方法发送简单get请求还是太麻烦,那么你可以直接使用$.get()方法。该方法只需要4个参数,发送请求的url,发送的数据,请求成功的回调函数,期望的返回值类型。3,post()方法使用$.post()方法和$.get()一样,他们都只需要4个参数。4,load()方法load()方法可以直接请求服务器的数据并添加到DOM元素中。默认使用get方式,如果你向服务器发送了数据,将自动转换为post方式。load()方法可以有3个参数,请求的url,向服务器发送的数据,请求成功后的回调函数。到此,关于“jQuery应用方法是什么”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注云技术网站,小编会继续努力为大家带来更多实用的文章!

相关推荐: python如何实现可链接迭代器

小编给大家分享一下python如何实现可链接迭代器,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!可链接迭代器以上是“python如何实现可链接迭代器”这篇文章的所有内容,感谢各位的阅…

文章页内容下
赞(0) 打赏
版权声明:本站采用知识共享、学习交流,不允许用于商业用途;文章由发布者自行承担一切责任,与本站无关。
文章页正文下
文章页评论上

云服务器、web空间可免费试用

宝塔面板主机、支持php,mysql等,SSL部署;安全高速企业专供99.999%稳定,另有高防主机、不限制内容等类型,具体可咨询QQ:360163164,Tel同微信:18905205712

主机选购导航云服务器试用

登录

找回密码

注册