JavaScript、jQuery、AJAX、JSON 之间的关系

现状遇到挑战演变出
静态网页不满足网页只是一些文字和图片的展示,希望页面上可以有更多功能。比如点击一个按钮,弹一个窗口或者改变页面上某些内容
JavaScript脚本语言
动态网页人类为了让自己页面功能更加丰富,使用了大量的 JavaScript,并且写了非常多的代码。
这时候发现不同浏览器对 JavaScript 的支持程度非常不统一,而且原生 JavaScript 实现某些看起来很简单的功能都很麻烦
jQuery 屏蔽了浏览器之间的兼容性问题
针对常用功能封装了大量的 API
并支持插件机制,让你写 JS 的效率很高,质量很好
JS框架简单的页面上的交互再次不满足人类的需求,比如一个资料填写表单,需要填写一个名称,这个名称还必须不能跟之前的重复。校验这个名称不能重复,就需要把数据提交上去,与服务器端数据交互的方法就是 form 提交表单。这时候需要用户填完所有的表单,点击『确定』之后提交校验。如果此时名称被占用就悲剧了。
解决这个问题的方案关键点在数据交互上面。最好的解决方案应该是输入完名字之后,就自动去把数据发给后端,然后拿到结果并提示给用户,而不是统一提交
无刷新的异步请求Ajax
 Ajax 技术提供了一种新的前后端数据交互方式,
不需要刷新页面,而且不阻塞页面执行流程
异步的去请求去获取、交互数据
Ajax异步请求一开始只是通过 Ajax 异步发一个请求,数据就是一个简单的用户名称,所以直接按照字符串发过去就好了。
后来需要 Ajax 发送的数据越来越多,比如一整张表单。这时候就需要有一套规则来描述更复杂的数据,
开始是用一些字符分割拼起来,后来使用用 xml 来描述,发现解析还是挺麻烦的,
基于 JavaScript 的数据类型创造了 JSON 数据格式,很简单就可以描述很复杂的数据。同时独立于语言,这样就可以在多种语言内使用。

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
jQuery是一个流行的JavaScript库,它简化了JavaScript编程的复杂性,并提供了许多实用的功能和工具。其中一个重要的功能是通过AJAX(Asynchronous JavaScript and XML)与服务器进行数据交互。 AJAX是一种在不刷新整个页面的情况下,通过后台与服务器进行异步通信的技术。它可以实现动态更新页面内容,提升用户体验。 在jQuery中,使用AJAX进行数据交互非常简单。其中,JSONJavaScript Object Notation)是一种常用的数据格式,用于在客户端和服务器之间传输数据。 使用jQueryAJAX方法可以轻松地发送AJAX请求,并处理服务器返回的JSON数据。以下是使用jQuery进行AJAX请求和处理JSON数据的基本步骤: 1. 使用$.ajax()方法发送AJAX请求,指定请求的URL、请求类型(GET、POST等)、数据等参数。 2. 在$.ajax()方法中使用success回调函数来处理服务器返回的数据。在这个回调函数中,可以对返回的JSON数据进行解析和操作。 3. 在success回调函数中,可以使用jQuery提供的方法(如$.each())来遍历JSON数据,并将其展示在页面上或进行其他操作。 下面是一个简单的示例代码,演示了如何使用jQuery进行AJAX请求并处理返回的JSON数据: ```javascript $.ajax({ url: 'example.com/api/data', type: 'GET', dataType: 'json', success: function(data) { // 处理返回的JSON数据 $.each(data, function(index, item) { // 对每个数据项进行操作 console.log(item.name); }); } }); ``` 这个示例中,我们发送了一个GET请求到`example.com/api/data`,并期望返回的数据是JSON格式。在success回调函数中,我们使用$.each()方法遍历返回的JSON数据,并打印每个数据项的名称。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值