首页 > 其他分享> 文章详细

day03

2022-02-18 02:31:07 阅读：174 来源： 互联网

标签：web Google 网页 day03 Ajax 服务器加载

Ajax

Ajax即Asynchronous Javascript And XML（异步JavaScript和XML）。

Ajax是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术，这使得程序能够更快地回应用户的操作。

Ajax不是一种新的编程语言，而是一种用于创建更好更快以及交互性更强的web应用程序的技术。

C/S(Client/Server)即"客户端/服务器"模式

增加B/S的体验性

B/S(Browser/Server)即"浏览器/服务器"模式：未来的主流

在2005年。Google通过其Google Suggest使Ajax变得流行起来。

Google Suggest使用Ajax创造出动态性极强的web界面：当你在谷歌的搜索框输入关键字时，JavaScript会把这些字符发送到服务器，然后服务器会返回一个搜索建议的列表。

传统的网页(即不用Ajax技术的网页)，想要更新内容或者提交一个表单都需要重新加载整个网页。

使用Ajax技术的网页，通过在后台服务器进行少量的数据交换，就可以实现异步局部更新。

使用Ajax，用户可以创建接近本地桌面应用的直接、高可用、更丰富、更动态的web用户界面。

利用Ajax可以做：

注册时，输入用户名自动检测用户是否已经存在。

登陆时，提示用户名/密码错误

删除数据时，将行ID发送到后台，后台在数据库中删除，数据库删除成功后，在页面DOM中将数据行也删除。

使用前端标签来伪造Ajax。iframe标签：

 <!DOCTYPE html>
 <html>
     <head>
         <meta charset="UTF-8">
         <title>伪造Ajax</title>
     </head>
     <script type="text/javascript">
         function loadpage(){
             var targetUrl=document.getElementById('url').value;
             document.getElementById('iframePosition').src=targetUrl;
         }
     </script>
     <body>
         <div>
             <p>请输入要加载的网址:</p>
             <p>
                 <input type="text" id="url" value="https://www.bilibili.com/video/BV1Kt411u7BV/?spm_id_from=autoNext"/>
                 <input type="button" value="提交" onclick="loadpage()"/>
             </p>
         </div>
         <div>
             <h3>加载页面的位置:</h3>
             <iframe style="width: 100%;height: 600px;" id="iframePosition"></iframe>
         </div>
     </body>
 </html>

 $.ajax({
     url:待载入页面的url地址(json字符串),
     type:请求方式('get','post'),
     dataType: 传回到客户端的数据格式"json",
     data:待发送的key/value参数，
     success:载入成功时回调函数function(data--封装了服务器返回的数据，status--状态){
     ...
 }
 });

标签：web,Google,网页,day03,Ajax,服务器,加载
来源： https://www.cnblogs.com/luqi-java/p/15907070.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

day03

Ajax