背景:使用了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 的一个别名

Java程序员之JS(一) 入门的更多相关文章

  1. 为 Java 程序员准备的 Go 入门 PPT

    为 Java 程序员准备的 Go 入门 PPT 这是 Google 的 Go 团队技术主管经理 Sameer Ajmani 分享的 PPT,为 Java 程序员快速入门 Go 而准备的. 视频 这个 ...

  2. 来自Java程序员的Python新手入门小结

    欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...

  3. Java程序员之Spring(一) 入门

    一. Spring 原理讲解  Spring 是一个轻量容器框架(开源):Spring的核心是 IoC(控制反转) 和 AOP(面向切面编程): Spring 由7个模块组成: Spring Core ...

  4. Java程序员之JS(一) 之 JQuery.ajax

    背景:紧着现在项目的需要,先从JQuery.ajax出发,主要需求是通过 js 调用Java 代码,从而适应现在的项目. 先从几个概念开始讲解: 一. 什么是Deferred  Deferred 对象 ...

  5. java程序员理解js中的闭包

    1.闭包概念: 就是函数内部通过某种方式访问一个函数内部的局部变量 再次理解: 闭包产生原因: 1.内部函数引用了外部函数的变量 作用:延长局部变量的生命周期 让函数外部可以调用到函数内部的数据 利用 ...

  6. Java 程序员的大数据入门指南

    项目 GitHub 地址:https://github.com/heibaiying/BigData-Notes ✒️ 前 言 大数据常用技术栈思维导图 大数据常用软件安装指南 一.Hadoop 分布 ...

  7. Java程序员必备后台前端框架--Layui【从入门到实战】(一)

    layui入门使用及图标的使用 作者 : Stanley 罗昊 [转载请注明出处和署名,谢谢!] [编程工具:IDEA] 下载Layui与文件分析 下载直接去官网下载即可 文件分析 下载完成后,解压会 ...

  8. Java程序员快速入门Go语言

    这篇文章帮助Java程序员快速入门Go语言. 转载至 开源中国社区. http://www.oschina.net 本文将以一个有代表性的例子为开始,以此让Java程序员对Go语言有个初步认识,随后将 ...

  9. java程序员入门:英语好不好对编程到底有没有影响

    我想当码农,听说钱钱拿的多! 哦.是很有钱!么样? 可是我不会! 那你想么样?去学撒! 可是,我英语差-- 有多差??? 很差-- 那????? 关于英语水平对编程的影响,我们一起来看看啦!希望可以解 ...

随机推荐

  1. python蛋痛的依赖管理

    java有maven 来统一管理项目依赖.初学python不久还没发现类似这样的工具.只有暂时用这个方法来手动操作了. 你可以用pip导出你的dependency: $ pip freeze > ...

  2. 复位compiz和unity

    compiz是最最不稳定的组件....绝大部分死机(图形界面没反应)都是由于这货. 所以为了我们系统的稳定,最好不要蛋疼去修改compiz的配置添加神马3D特效,这样导致更不稳定,这样做之后估计你一整 ...

  3. JSON数组字典解析

    遇到这样的字典数组字符串 priceRange = "[{\"id\":149075584861800,\"price\":9.9,\"nu ...

  4. Linux:declare命令详解

    declare declare命令用于声明和显示已存在的shell变量.当不提供变量名参数时显示所有shell变量.declare命令若不带任何参数选项,则会显示所有shell变量及其值.declar ...

  5. 关于HslCommunication组件的双模式客户端的说明,此说明适用于所有的派生类客户端,包括三菱,西门子,欧姆龙,modbustcp,机器人,simplifyNet客户端等等

    前言 本文主要是答疑文章,针对广大网友非常频繁的提问而总结的问题 nuget地址:https://www.nuget.org/packages/HslCommunication/            ...

  6. 人生苦短之我用Python篇(列表list、字典dict、元组tuple、字符串str)

    列表 创建列表 sample_list = ['a',1,('a','b')] Python 列表操作 sample_list = ['a','b',0,1,3] 得到列表中的某一个值 value_s ...

  7. HTML编写规范

    HTML和CSS编码规范内容 一.HTML规范 二.CSS规范 三.注意事项: 四.常用的命名规则 五.CSS样式表文件命名 六.文件命名规则 一.HTML规范: 1.代码规范 页面的第一行添加标准模 ...

  8. laravel 修改重置密码模板

    Laravel里我们可以使用php artisan make:auth来生成一套默认的登陆注册重置邮箱的Authentication System,但是如何修改系统发送给用户的重置密码邮件的样式和内容 ...

  9. 用xapian来做索引

    最近一个项目需要正则搜索MongoDB,400多万的数据一次查询要20s以上,需要建立一个前端索引服务.本着部署简单.开发容易的原则,找到了xapian这个索引库. 我使用的是Python的接口,xa ...

  10. try...except包含try...finally方法

    def f(): try: try: f = open(raw_input('>')) print f.readlines() finally: f.close() #1/0 except Ex ...