背景:使用了JS做一个 WEB 项目之后,一直有使用JS 的一个功能,突然某一天项目重新规划,开始自己手动写一些原始JS,情况不妙,原来之前一直是用同事搭建好的框架在开发,对 JS 零基础的我一直在 ctrl+c/ctrl+v的重复操作,偶尔写一些局部事件,针对什么是JS/ajax/jQuery/$一概不知。
一. JS/ajax/jQuery/$ 比较,先说一下结论:它们之间没有可比性
开篇之前对JS/ajax/jQuery/$傻傻分不清,直观的用起来感觉都是一个东西,其实他们之后没有可比性:
1. JS 是一种语言; 相当于 Java语言;
2. ajax 是一门技术;
3. jQuery 是一个库或者框架; 相当于JavaBean, 在java的基础上开发出来,用来更加方便处理某一类业务而产生;
4. $是 JQuery 的别名;
二. JS/ajax/jQuery/$ 概念理解
1. 什么是JS
JS是JavaScript 的简称,JavaScript 是一种轻量级的脚本语言,用来给静态页面增加动态效果,主要用在 web 项目开发中或一些网站上;
解析JavaScript 的解释器成为 JavaScript 引擎,为浏览器的一部分。web客户端大部分是浏览器,利用 js 另一方面提高了浏览器访问效率同时减轻了服务器的负载。
2. 什么是 ajax
ajax 是的一门技术, 实现异步请求、局部更新; 所谓异步, 就是向服务器发送请求,不必等待结果就可以做其他事情; 所谓局部更新, 是指不用加载整个页面,只是向服务器请求少量数据, 实现局部更新的效果;
a: 异步; j: javascript; a: and; x: xml;
好处:传输数据量减少、减轻服务器负载、缩短用户等待时间;
eg:1. 网页上的股票波动图, 在ajax之前,是每隔10秒后台自动刷新一界面;ajax,只是部分内容更改;
2. 朋友圈点赞,界面效果:只是更新了点赞的数据量;
说明:Ajax 是一段用JS写出来的代码,用于实现JS同后台交互的功能;
3. 什么是 JQuery
JQuery 是JS 的一个库或框架,它兼容 CSS3 和不同浏览器(JQuery2 以后不支持IE6.7.8);
使用 JQuery 能够实现 Write Less Do More 的效果,用很少的代码即可实现一些比较繁杂的工作,JQuery 的增强操作体现在下面几点:
1. 访问 HTML节点并对它做一些操作;
2. 事件处理;
3. 动画;
4. 快速 Web 开发中 ajax 互操作;
说明: JQuery 很强大,代码也比较精炼,JQuery 上手比较简单,是刚做前端开发的人的首选,但很多用JQuery开发多年的前端工程师,摒弃JQuery 对JS代码看不懂也是现在的一个常态(被很多前端大牛所鄙视),当能使用JQuery 之后需要回头对JS语法进行一个重学,避免知其然而不知其所以然的情况。
4. 什么是 $
在 JQuery 中, $符号是JQuery 的别名,默认JQuery 类库是以JQuery 开头。
三. JS/ajax/jQuery/$ 之间的 关联关系
JS 是语言基础,用于实现动态网页;
Ajax 是一段 JS 代码,一个应用于同后台交互的技术;
JQuery 是一个类库,根据一些常用的操作组合而成的轻量级 JS 库,被大部分前端开发所使用;
$ 是 JQuery 的一个别名