JavaScript___05.14
一、jQuery AJAX
1.什么是AJAX
1.AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML），简单来说，在不重载整个网页的情况下，AJAX通过后台加载数据，并在网页上进行显示。
2.应用案例：谷歌地图、优酷视频、人人网等
2.jQuery-AJAX load()方法
1.从服务器加载数据，并把数据放入我们指定的元素中
2.语法
$(selector).load(URL.data.callback)
必须的URL参数规定加载的地址
可选的data参数规定与请求一同发送的查询字符串（键值对集合）
3.自动获取练习
代码如下：
1. <!DOCTYPE html>
2. <html lang="en">
3. <head>
4. <meta charset="UTF-8">
5. <title>Title</title>
6. <script src="jquery-1.9.1.min.js"></script>
7. <script>
8. $(document).ready(function(){
9. $("#div1").mouseover(function(){
10. url="demo1.txt";
11. $("#div1").load(url)
12. })
13. $("#div1").mouseout(function(){
14. $("#div1").html("");
15. })
16. //1、如下是获取外部文本
17. $("#button1").click(function(){
18. url="demo1.txt";
19. $("#div1").load(url)
20. })
21. })
22. </script>
23. </head>
24. <body>
25. <div id="div1" style="background-color:rgb(204,204,153);width:200px;height:100px;"></div>
26. <button id="button1">获取外部文本</button>
27. </body>
28. </html>
四.获取外部信息有无回调函数
代码如下：
1. //3、如下是获取外部信息有无回调函数
2. $("#button3").click(function(){
3. $("#div1").load("demo1.txt ",function(responseTxt,statusTxt){
4. if(statusTxt == "success"){
5. alert("外部内容加载成功")
6. }
7. if(statusTxt == "error"){
8. alert("错误信息")
9. }
10. })
11. })
知识点：
①在load()方法中callback是可选的参数，callback（回调函数）规定当load方法完成后所需要执行的回调函数，callback回调函数的参数设置
②responseTxt:包含回调成功后的返回结果内容(响应类型)
③statusTxt:回调状态
④eg:首先load()方法完成后显示一个提示框，如果load()方法换行成功，则显示“外部内容加载成功”，如果失败，显示“错误信息”
⑤node:成功-“success” 失败-“error”
3193
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
