ajax 请求

当接触一项新技术时,首先我们要问自己四个问题,如果这四个问题我们都能学习并理解到位,那么可以说这个新技术你已经完成了初步掌握,下面我们就这四个问题来说ajax应该怎么学习。如果你已经看过我写的JS中ajax的使用教程,相信你对ajax已经有了一个基础了解。那么可以直接看第四部分,以便节约您的时间。

一,ajax是什么?
AJAX = 异步 JavaScript 和 XML。是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。有很多使用 AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等。

二,ajax用在哪里?
简单说是需要连接数据库的地方,但是连接数据库传输的信息量很少,用不着刷新整个页面,这种类型的适合用ajax,避免了属性整个页面带来的资源浪费。

三,为什么要使用ajax?
减轻服务器的负担,按需取数,可以最大程度的减少冗余请求和响应对服务造成的负担。无恻新更新页面,减少用户心理和实际的等待时间。带来更好的用户体验。可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器和速写的负担,节约空间和宽带租用成本。可以调用外部数据。基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。进一步促进页面呈现和数据的分离。

四,怎么使用在JS中使用ajax?使用时我们要了解的基础知识

1,JQuery是什么东西?
是一个JavaScript类库,封装了大量的JavaScript底层代码。

2,JQuery的Ajax操作,对JavaScript底层Ajax操作进行了封装,提供了两种方法进行操作
第一种是底层的$.ajax()操作


$.ajax({
            url:"url",
            type:"get",
            dataType:"json",
            data:{
                userID:"1"
            },
            success:function(response){
 
            },
            error:function() {
            }
        });

第二种是快捷操作 . g e t ( ) . . .get().. .get()...post()…

$.get(
            "url",
            {userID:"123"},
            function(response) {
            }
        )
$.post(
            "url",
            {userID:"123"},
            function(response) {
 
            }
        )
$.post("你请求的地址",{你请求需要传递的参数},function(res){
 
})

下面是简单的应用

	var script = document.createElement('script');
	script.type = 'text/javascript';

	// 传参并指定回调执行函数为onBack
	script.src = 'http://102.201.87.103:9999/iotApi/getReceiveMsg';
	document.head.appendChild(script);

	// 回调执行函数
	function onBack(res) {
		alert(JSON.stringify(res));
	}
	$.ajax({
                url: 'http://102.201.87.103:9999/iotApi/getReceiveMsg',
                type: 'post',
                dataType: 'jsonp',  // 请求方式为jsonp
                crossDomain: true,
                success: function(data) {
					alert(JSON.stringify(data))
					console.log(data)
                },
                data: {
					uuid:"8622d15dff814"
				}
			});
    $(function(){
		$.ajax({
            url:"/iotApi/getReceiveMsg",
            type:"get",
            dataType:"json",
            data:{
                uuid:"8622d15dff814"
            },
            success:function(response){
				console.log(response)
            },
            error:function() {
				// console.log(error)
            }
        });

	})
   <script type="text/javascript">
	function repeat(){
		$.post('/iotApi/getReceiveMsg',{"uuid":"8622d15dff814"},function (res) {
		// 开始解析
			var msg=res.msg;
            if (res.code == 1) {
				if(msg.substr(7,4)=="0008"){
					document.getElementById("zhuangtai").innerHTML="开";
					console.log("测试");
				}
				
            }
        })
	}
</script>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值