登录
注册
开源
企业版
高校版
搜索
帮助中心
使用条款
关于我们
开源
企业版
高校版
私有云
模力方舟
AI 队友
登录
注册
代码拉取完成,页面将自动刷新
Watch
不关注
关注所有动态
仅关注版本发行动态
关注但不提醒动态
3
Star
48
Fork
24
DreamCoders
/
CoderGuide
代码
Issues
1169
Pull Requests
0
Wiki
统计
流水线
服务
JavaDoc
PHPDoc
质量分析
Jenkins for Gitee
腾讯云托管
腾讯云 Serverless
悬镜安全
阿里云 SAE
Codeblitz
SBOM
开发画像分析
我知道了,不再自动展开
更新失败,请稍后重试!
移除标识
内容风险标识
本任务被
标识为内容中包含有代码安全 Bug 、隐私泄露等敏感信息,仓库外成员不可访问
说说 ajax 原理?
待办的
#IAG9OP
陌生人
拥有者
创建于
2024-07-29 16:06
<p>Ajax 的原理简单来说是在用户和服务器之间加了—个中间层( AJAX 引擎),由 XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用 javascrip t 来操作 DOM 而更新页面。使用户操作与服务器响应异步化。这其中最关键的一步就是从服务器获得请求数据。</p><p>Ajax 的过程只涉及 JavaScript 、 XMLHttpRequest 和 DOM 。 XMLHttpRequest 是 ajax 的核心机制。</p><h4>Ajax 的优点:</h4><p>通过异步模式,提升了用户体验</p><p>优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用</p><p>Ajax 在客户端运行,承担了一部分本来由服务器承担的工作,减少了大用户量下的服务器负载</p><p>Ajax 可以实现动态不刷新(局部刷新)</p><h4>Ajax 的缺点:</h4><p>安全问题 AJAX 暴露了与服务器交互的细节</p><p>对搜索引擎的支持比较弱</p><p>不容易调试</p><h4>Ajax 的请求:</h4><pre><code class="language-javascript">/** 创建连接 **/ var xhr = null; xhr = new XMLHttpRequest() /** 2. 连接服务器 **/ xhr.open('get', url, true) /** 3. 发送请求 **/ xhr.send(null); /** 4. 接受请求 **/ xhr.onreadystatechange = function () { if (xhr.readyState == 4) { if (xhr.status == 200) { success(xhr.responseText); } else { /** false **/ fail && fail(xhr.status); } } }</code></pre><p><br></p>
<p>Ajax 的原理简单来说是在用户和服务器之间加了—个中间层( AJAX 引擎),由 XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用 javascrip t 来操作 DOM 而更新页面。使用户操作与服务器响应异步化。这其中最关键的一步就是从服务器获得请求数据。</p><p>Ajax 的过程只涉及 JavaScript 、 XMLHttpRequest 和 DOM 。 XMLHttpRequest 是 ajax 的核心机制。</p><h4>Ajax 的优点:</h4><p>通过异步模式,提升了用户体验</p><p>优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用</p><p>Ajax 在客户端运行,承担了一部分本来由服务器承担的工作,减少了大用户量下的服务器负载</p><p>Ajax 可以实现动态不刷新(局部刷新)</p><h4>Ajax 的缺点:</h4><p>安全问题 AJAX 暴露了与服务器交互的细节</p><p>对搜索引擎的支持比较弱</p><p>不容易调试</p><h4>Ajax 的请求:</h4><pre><code class="language-javascript">/** 创建连接 **/ var xhr = null; xhr = new XMLHttpRequest() /** 2. 连接服务器 **/ xhr.open('get', url, true) /** 3. 发送请求 **/ xhr.send(null); /** 4. 接受请求 **/ xhr.onreadystatechange = function () { if (xhr.readyState == 4) { if (xhr.status == 200) { success(xhr.responseText); } else { /** false **/ fail && fail(xhr.status); } } }</code></pre><p><br></p>
评论 (
0
)
登录
后才可以发表评论
状态
待办的
待办的
进行中
已完成
已关闭
负责人
未设置
标签
Html/JS/CSS
未设置
标签管理
里程碑
未关联里程碑
未关联里程碑
Pull Requests
未关联
未关联
关联的 Pull Requests 被合并后可能会关闭此 issue
分支
未关联
分支 (
-
)
标签 (
-
)
开始日期   -   截止日期
-
置顶选项
不置顶
置顶等级:高
置顶等级:中
置顶等级:低
优先级
不指定
严重
主要
次要
不重要
参与者(1)
1
https://gitee.com/DreamCoders/CoderGuide.git
git@gitee.com:DreamCoders/CoderGuide.git
DreamCoders
CoderGuide
CoderGuide
点此查找更多帮助
搜索帮助
Git 命令在线学习
如何在 Gitee 导入 GitHub 仓库
Git 仓库基础操作
企业版和社区版功能对比
SSH 公钥设置
如何处理代码冲突
仓库体积过大,如何减小?
如何找回被删除的仓库数据
Gitee 产品配额说明
GitHub仓库快速导入Gitee及同步更新
什么是 Release(发行版)
将 PHP 项目自动发布到 packagist.org
仓库举报
回到顶部
登录提示
该操作需登录 Gitee 帐号,请先登录后再操作。
立即登录
没有帐号,去注册