微信扫一扫打赏支持

js进阶 14-1 jquery的ajax系列中的load方法的作用是什么

js进阶 14-1 jquery的ajax系列中的load方法的作用是什么

打赏

 

一、总结

一句话总结：jQuery load()方法作用是从服务器加载数据，是一个简单但强大的AJAX方法。

 

1、load函数的必选参数是什么（根据功能想）？

必选参数就是要加载页面的url，也可以选择加载文件的哪一个部分

下面的代码时直接加载test.html 的 .p2部分

20             $('#test').load('test.html .p2')

 

2、ajax如何加载别的页面（.html）？

直接用load方法即可

load方法一句代码就可以了

 

3、如何实现博客园相关文章推荐功能？

ajax的load方法即可，load方法加载页面

20             $('#test').load('test.html .p2')

 

4、load方法的监听对象是谁？

你想把内容加载到哪个元素，你就去监听谁

 

 

二、jquery的ajax系列中的load方法的作用是什么

1、相关知识

load()方法

jQuery load()方法作用是从服务器加载数据，是一个简单但强大的AJAX方法。

  • .load()从服务器加载数据，然后把返回到HTML放入匹配元素。

    语法：load(url,data,function(response,status,xhr))

    1.必需的URL参数规定您希望加载的URL。

    2.可选的data参数规定与请求一同发送的查询字符串键/值对集合。

    3.可选的callback参数是load()方法完成后所执行的函数名称

  • 回调函数参数含义

    1. responseTxt-包含调用成功时的结果内容

    2. statusTXT-包含调用的状态：可能是"success"、"notmodifide"、"error"、'timeout"、"abort"或"parsererror"中的一个，最长见的是：succes成功;error错误

    3. Xhr-经过jQuery封装的XMLHttpRequest对象（保留其本身的所有属性和方法）

 

 

2、代码

复制代码
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <style>
 4 </style>
 5 <head>
 6     <meta charset="UTF-8">
 7     <title>演示文档</title>
 8     <script type="text/javascript" src="jquery-3.1.1.min.js"></script>
 9     <style type="text/css">
10     p{background: #ccc;color: rgb(100,50,150);width: 600px;text-indent: 2em}
11       </style>
12 </style>
13 </head>
14     <input type="button" id="btn" value="Ajax测试">
15     <div id="test"></div>
16 <body>
17 <script type="text/javascript">
18     $(function(){
19         $('#btn').click(function(){
20             $('#test').load('test.html .p2')
21         })
22     })
23 </script>
24 </body>
25 </html>
复制代码

 

 

 

 
posted @   范仁义  阅读(1114)  评论(0)  编辑  收藏  举报
编辑推荐：
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
阅读排行：
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗？
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句：使用策略模式优化代码结构
· AI与.NET技术实操系列（六）：基于图像分类模型对图像进行分类
历史上的今天：
2017-07-20 L2-002. 链表去重
2017-07-20 L2-003. 月饼
侧边栏
打赏
点击右上角即可分享
微信分享提示
SQL AI 助手