闲聊jQuery(一)
Write less, do more.
这便是jQuery的宗旨!jQuery,一个高效、精简并且功能丰富的 JavaScript 工具库。
想必,对于每一个前端开发者,一定用过jQuery吧!俗话说,学会jQuery,打哪儿都不怕!(瞎说的。。) jQuery也是我接触过的第一个JavaScript工具库。说句心里话,jQuery用起来确实很爽!下面分析几点:
1.原生JavaScript中获取元素(document.getElementById,document.getElementsByClassName,document.getElementByName...),一写一大串,写起来很烦。再看看jQuery中获取元素($('id或className或HTML标签名称'))。真是方便!
2.jQuery中对ajax进行了封装,用起来非常顺手。
原生ajax:
function success(res) {
//do something
}
function fail(res) {
//do something
}
var request = new XMLHttpRequest(); // 新建XMLHttpRequest对象
request.onreadystatechange = function () { // 状态发生变化时,函数被回调
if (request.readyState === 4) { // 成功完成
// 判断响应结果:
if (request.status === 200) {
// 成功,通过responseText拿到响应的文本:
return success(request.responseText);
} else {
// 失败,根据响应码判断失败原因:
return fail(request.status);
}
} else {
// HTTP请求还在继续...
}
}
// 发送请求:
request.open('GET', '/xxx');
request.send();
alert('请求已发送,请等待响应...');
jQuery ajax:
$.ajax({
url: "", //后台服务地址
type: "POST" 或 "GET", //还可以是PUT、DELETE
success: function(){
//do something
},
error: function() {
//do something
}
}); //jQuery ajax还提供了很多可选的属性,有兴趣可以去查看下相关文档!
3.jQuery提供很多便捷的事件方法。
jQuery事件方法:浏览器事件,文档加载,绑定事件处理器,事件对象,表单事件,键盘事件,鼠标事件。这里的话,有兴趣的话可以查看相关文档链接。
4.jQuery提供了快速实现动画效果的方法。
只需使用jQuery的一个方法就可以让你的页面更加生动!比如:.fadeIn() 、.animate()
jQuery的版本,最新版本jQuery3.2.1 。目前,jQuery共有3代版本,分别是:jQuery1.x.x、jQuery2.x.x、jQuery3.x.x。
这里注意的是,从jQuery2.x.x开始级以后的版本不再对ie9以下等浏览器的支持。官方原话:If you need to support older browsers like Internet Explorer 6-8, Opera 12.1x or Safari 5.1+, use jQuery 1.12.
jQuery统一了不同浏览器之间的DOM操作,使用它,你便可以轻松的对页面进行DOM操作!
后续,我将深入jQuery,学习了解这个JavaScript库是如何实现的,并着手打造一个jQuery插件。 c⌒っ*゚∀゚)メ装完就跑
闲聊jQuery(一)的更多相关文章
- 网页插件学javascript还是jquery好啊?
文章的起因,也是在群内交流是回答一个小伙的问题,一扯就停不下来,但由于个人知识面覆盖有限,自身基础又不够扎实,仅供参考: 问这个问题之前,我个人建议先搞清什么是jquery,什么是js? jq ...
- 堆糖瀑布流完整解决方案(jQuery)
2010年堆糖创办以来,网站界面经历过3-5次重大改版,logo也曾更换过两次,早期蓝红相间三个圈的logo恐怕很少有人记得了.与此同时,前端 js 框架也在默默的更新换代.最早堆糖上线时,js 采用 ...
- 解析jQuery中extend方法--源码解析以及递归的过程《二》
源码解析 在解析代码之前,首先要了解extend函数要解决什么问题,以及传入不同的参数,会达到怎样的效果.extend函数内部处理传入的不同参数,返回处理后的对象. extend函数用来扩展对象,增加 ...
- jquery实现同时展示多个tab标签+左右箭头实现来回滚动(美化版增加删除按钮)
闲聊 前段时间小颖分享了:jquery实现同时展示多个tab标签+左右箭头实现来回滚动文章,引入项目后,我们的组长说样子太丑了,小颖觉得还好啊,要不大家评评理,看下丑不丑?无图无真相,来上图: 看吧其 ...
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
- jQuery UI resizable使用注意事项、实时等比例拉伸及你不知道的技巧
这篇文章总结的是我在使用resizable插件的过程中,遇到的问题及变通应用的奇思妙想. 一.resizable使用注意事项 以下是我在jsfiddle上写的测试demo:http://jsfiddl ...
- Jquery的点击事件,三句代码完成全选事件
先来看一下Js和Jquery的点击事件 举两个简单的例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...
- jQuery实践-网页版2048小游戏
▓▓▓▓▓▓ 大致介绍 看了一个实现网页版2048小游戏的视频,觉得能做出自己以前喜欢玩的小游戏很有意思便自己动手试了试,真正的验证了这句话-不要以为你以为的就是你以为的,看视频时觉得看懂了,会写了, ...
- jquery和Js的区别和基础操作
jqery的语法和js的语法一样,算是把js升级了一下,这两种语法可以一起使用,只不过是用jqery更加方便 一个页面想要使用jqery的话,先要引入一下jqery包,jqery包从网上下一个就可以, ...
随机推荐
- 五:理解控件的运行机制(例:基于Control命名空间的简单控件)
一:先用最简短的话说点理论的1.asp.net中所有的标准控件都可以重写 2.和控件相关的命名空间有 System.Web.UI.Control是所有控件的基类只提供简单的呈现逻辑,不支持样式表 Sy ...
- koa-router post请求接收的参数为空
注:koa-router路由和koa-bodyparser中间件 post请求中参数为空. 页面代码 <!DOCTYPE html> <html> <head> ...
- Charles抓包之HTTPS抓包配置
访问我的博客 前言 由于工作中经常需要配置客户端开发人员对接接口,有时候对接地不太顺利,因此需要经常性地对公司 APP 进行抓包看请求,找出具体的原因. 在公司中开发使用的 Windows 台式电脑, ...
- [error] 1507#0: *22 FastCGI sent in stderr: "Primary script unknown" while reading response header from upstream, client: 10.0.0.1, server: www.wordpress.com, request: "GET /info.p
字体比较小,如果你遇到这个问题请仔细的把下面的总结看完. 环境:CentOS6.7.2.6.32-573.el6.x86_64.nginx1.12.2 .php5.5.38 问题:nginx能解析静态 ...
- shell脚本案例分享 - 业务系统日志自定义保留或删除需求
需求说明: 线上某些业务系统的日志不定期产生, 有的每天产生, 有的好几天才产生, 因为系统只有在用的时候才产生日志,日志文件均存放在以当天日期命名的目录下. 当日志目录越来越多时就需要处理, 由此 ...
- list双向链表容器(常用的方法总结)
特别注意,由于list对象的结点并不要求在一段连续的内存中,所以,对于迭代器,只能通过++或者--的操作将迭代器移动到后继或者前驱结点元素处.而不能对迭代器进行+n或者-n的操作,这点与vector等 ...
- 文档数据库MongoDB
MongoDB是一个基于分布式文件存储的文档式数据库.其由C++编写, 旨在为Web应用提供可扩展的高性能数据存储解决方案. MongoDB中每条数据记录被作为一个文档存储,文档由集合(collect ...
- [Angularjs]ng-bind-html指令
摘要 在为html标签绑定数据的时,如果绑定的内容是纯文本,你可以使用{{}}或者ng-bind.但在为html标签绑定带html标签的内容的时候,angularjs为了安全考虑,不会将其渲染成htm ...
- WPF文字修饰——上、中、下划线与基线
我们知道,文字的修饰包括:空心字.立体字.划线字.阴影字.加粗.倾斜等.这里只说划线字的修饰方式,按划线的位置,我们可将之分为:上划线.中划线.基线与下划线.如图: 从上至下,分别为上划线(Overl ...
- Retrofit2+Rxjava+OkHttp的使用和网络请求
Retrofit2+Rxjava+OkHttp的使用和网络请求 https://blog.csdn.net/huandroid/article/details/79883895 加入Rxjava 如果 ...