ajax

最新推荐文章于 2022-06-19 13:50:53 发布

风吹动了我的腋毛

最新推荐文章于 2022-06-19 13:50:53 发布

阅读量56

点赞数

本文链接：https://blog.csdn.net/qq_44785072/article/details/90320851

版权

1.jquery AJAX是什么?

AJAX=异步(Asynchronous)异步Javascript和XML（json）
AJAX 是与服务器交换数据的艺术，它在不重载全部页面的情况下，实现了对部分网页的更新。
应用案列：谷歌地图，优酷视频，人人网。
2.jQuery - AJAX load() 方法
jQuery load() 方法：load() 方法从服务器加载数据，并把返回的数据放入被选元素中。
语法：
$(selector).load(URL,data,callback);
必需的 URL 参数规定加载的 URL。
可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。

一：AJAX运用

这是示例文件（“demol.txt”）的内容：

jQuery and AJAX is FUN!!!

This is some text in a paragraph.

2.下面的例子把 "demo.txt" 文件中 id="p1" 的元素的内容，加载到指定的

元素中： $("#div1").load("demo1.txt #p1") 3.可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。回调函数可以设置不同的参数： responseTxt - 包含调用成功时的结果内容 statusTXT - 包含调用的状态 xhr - 包含 XMLHttpRequest 对象 4. 首先load()方法完成后显示一个提示框，如果load方法执行成功，则显示"外部内容加载成功" 如果失败，显示'错误信息' 5.JQuery---AJAX 的get()和post()方法: 主要用于通过HTTP GET 或 POST请求从服务器里面请求数据。 GET: 从指定的资源请求数据，GET基本上用于从服务器获取数据 POST: 向指定的资源提交要处理的数据，POST也可以从服务器获取数据，并且常用于连同请求一起发送数据。不会缓存(cookie)数据。 ajax---> get()方法，语法： $("selector").get(url,callback) url ---必须参数， callback----可选参数 eg: 使用get()方法从服务器上的一个文件中获取数据

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-1.8.3.min.js"></script>
    <script>
        
        $(document).ready(function(){ 
            $("#div1").mouseover(function(){
                url = "demo1.txt"
                $("#div1").load(url)
            })
            $("#div1").mouseout(function(){
                $("#div1").html(" ")
            })
            $("#button1").click(function(){
                url = "demo1.txt"
                $("#div1").load(url)
            })
            
            $("#button2").click(function(){
                $("#div1").load("demo1.txt #p1")
            })
        
            $("#button3").click(function(){
                $("#div1").load("demo1.txt",function(responseTxt,statusTxt){
                    if(statusTxt =='success'){
                        alert("外部内容加载成功")
                    }
                    if(statusTxt =='error'){
                        alert('错误信息')
                    }
                })
            })
 
         
            $("#button4").click(function(){
                jQuery.get("demo.php",function(data,status){
                    alert("数据："+data+"\n状态："+status)
                })
            })
       
    </script>
</head><body>
<div id="div1" style="background-color: rgb(204,204,153);
width: 200px;height:400px;overflow: scroll"></div>
<button id="button1">获取外部信息</button>
<button id="button2">获取指定外部信息</button>
<button id="button3">获取外部信息有回调函数</button>
<button id="button4">发送HTTP get请求并获取返回结果</button>
 
 
</body>
</html>

风吹动了我的腋毛

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax

1.jquery AJAX是什么?AJAX=异步(Asynchronous)异步Javascript和XML（json）AJAX 是与服务器交换数据的艺术，它在不重载全部页面的情况下，实现了对部分网页的更新。应用案列：谷歌地图，优酷视频，人人网。2.jQuery - AJAX load() 方法jQuery load() 方法：load() 方法从服务器加载数据，并把返回的数据放入被选元...
复制链接

扫一扫