AJAX技术简介

7 篇文章 0 订阅

AJAX全称:Asynchronous JavaScript And XML(异步JavaScript及XML),是一种可以在不必刷新整个浏览器的情况下,与服务器进行异步通讯的技术。即AJAX是一个局部刷新的异步通讯的技术。

AJAX主要是通过XMLHttpRequest对象(即AJAX对象)处理发送请求和回应的。

创建XMLHttpRequest对象的方法如下 :

function getAJAX() {
	try {
		return new ActiveXObject("microsoft:xmlhttp"); //IE浏览器
	} catch (e) {
		return new XMLHttpRequest(); //其他浏览器 
	}
}

                                                                                                       图片内容来源:李兴华《Java Web开发实战经典》

AJAX状态码

0: AJAX异步对象创建好了,但暂时未准备发送请求 。

1: AJAX已调用了open方法,但暂时没有真正发送请求。

2: AJAX已经调用了send方法,但暂时没有达到服务器。

3 :请求已经到达服务端,正在处理中,服务端正在将相应返回的过程中。

4: AJAX对象已经完全接受到了服务器的响应信息。

----------------------------------------------------------------------------------------------------------------

AJAX两种请求方式(GET和POST)的区别:https://blog.csdn.net/lhjuejiang/article/details/79470245

----------------------------------------------------------------------------------------------------------------

AJAX的应用:https://blog.csdn.net/qq_40302790/article/details/98070981

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
首先,我们需要使用前端的 AJAX 技术来从后端项目中获取商品信息。下面是一个示例代码: ```html <!DOCTYPE html> <html> <head> <title>商品页</title> <meta charset="utf-8"> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script> </head> <body> <table id="goodsTable"> <thead> <tr> <th>ID</th> <th>商品名称</th> <th>价格</th> <th>规格</th> <th>简介</th> </tr> </thead> <tbody></tbody> </table> <script> // 使用 AJAX 获取商品信息 $.get('http://10.8.12.150:8088/ajaxtest/goods', function(data) { // 将得到的 JSON 数据转换为 JavaScript 对象 var goodsList = JSON.parse(data); // 遍历商品数组,生成 HTML 代码并添加到表格中 goodsList.forEach(function(goods) { var html = '<tr>' + '<td>' + goods.id + '</td>' + '<td>' + goods.goodsName + '</td>' + '<td>' + goods.price + '</td>' + '<td>' + goods.spec + '</td>' + '<td>' + goods.about + '</td>' + '</tr>'; $('#goodsTable tbody').append(html); }); }); </script> </body> </html> ``` 在这个示例中,我们使用了 jQuery 库来简化 AJAX 的操作。我们使用 $.get 方法来发送 GET 请求,得到的数据会自动转换为字符串类型的 JSON 数据。我们通过 JSON.parse 方法将其转换为 JavaScript 对象,并遍历商品数组,生成 HTML 代码并添加到表格中。 注意,由于跨域访问的限制,我们需要确保后端项目支持跨域访问。如果不支持,我们可以使用 JSONP 或者代理等技术来解决跨域问题。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值