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--状态){
...
}
});
day03-了解ajax的更多相关文章
- 前端复习之Ajax,忘完了
1 * Day01: 2 * Ajax 3 * Asynchronous JavaScript and XML 4 * 直译中文 - JavaScript和XML的异步 5 * (不严格的定义)客户端 ...
- jQuery之ajax实现篇
jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...
- Ajax及跨域
概念 Ajax Ajax,Asynchronous JavaScript and XML,字面意思:异步的 JavaScript 和 XML,是指一种创建交互式网页应用的网页开发技术. 用于异步地去获 ...
- 一个粗心的Bug,JSON格式不规范导致AJAX错误
一.事件回放 今天工作时碰到了一个奇怪的问题,这个问题很早很早以前也碰到过,不过没想到过这么久了竟然又栽在这里. 当时正在联调一个项目,由于后端没有提供数据接口,于是我直接本地建立了一个 json ...
- ABP文档 - Javascript Api - AJAX
本节内容: AJAX操作相关问题 ABP的方式 AJAX 返回信息 处理错误 HTTP 状态码 WrapResult和DontWrapResult特性 Asp.net Mvc 控制器 Asp.net ...
- ajax异步请求
做前端开发的朋友对于ajax异步更新一定印象深刻,作为刚入坑的小白,今天就和大家一起聊聊关于ajax异步请求的那点事.既然是ajax就少不了jQuery的知识,推荐大家访问www.w3school.c ...
- 调用AJAX做登陆和注册
先建立一个页面来检测一下我们建立的用户名能不能用,看一下有没有已经存在的用户名吗 可以通过ajax提示一下 $("#uid").blur(function(){ //取用户名 va ...
- Ajax 概念 分析 举例
Ajax是结合了访问数据库,数据访问,Jquery 可以做页面局部刷新或者说是页面不刷新,我可以让页面不刷新,仅仅是数据的刷新,没有频繁的刷页面,是现在比较常用的一种方式做页面那么它是怎么实现页面无刷 ...
- ajax
常见的HTTP状态码状态码:200 请求成功.一般用于GET和POST方法 OK301 资源移动.所请求资源移动到新的URL,浏览器自动跳转到新的URL Moved Permanently304 未修 ...
- 学习笔记之MVC级联及Ajax操作
由于刚转型到MVC,MVC的架构模式很多不是很清楚,比如今天就想做个级联的操作,因为之前的ASP.NET的方式是通过:控件-->添加事件-->后台编写级联事件进行触发,但是这个MVC就不同 ...
随机推荐
- 【转载】 TensorFlow - 框架实现中的三种 Graph图结构
原文地址: https://zhuanlan.zhihu.com/p/31308381 -------------------------------------------------------- ...
- 如何在anaconda环境中安装cuda.h和cuda_runtime.h
在前面的文章(几年前的文章)中我们介绍了在anaconda中安装cuda.cudnn后,有介绍了如何在anaconda中安装nvcc.nccl等NVIDIA的各种编译器和库,本文介绍如何在anacon ...
- 3.2.0 版本预告!远程日志解决 Worker 故障获取不到日志的问题
Apache DolphinScheduler 3.2.0 版本已经呼之欲出,8 月 中下旬,这个大版本就要和用户见面了.为了让大家提前了解到此版本更新的主要内容,我们已经制作了几期视频和内容做了大致 ...
- 视频中ppt、代码、ubuntu环境请扫描下面二维码,回复:ubuntu,即可获得
历时4个多月,第一期Linux驱动视频录制完毕, 一共32期,现在全部同步到了B站. 如果你觉得视频对你有用,建议大家多多点赞,投投免费硬币, 算是对我辛苦的劳动的认可. 视频中ppt.代码.ubun ...
- RabbitMQ 基础概念与架构设计及工作机制学习总结
什么是RabbitMQ MQ全称为Message Queue,即消息队列. 它也是一个队列,遵循FIFO原则 .RabbitMQ则是一个开源的消息中间件,由erlang语言开发,基于AMQP协议实现的 ...
- 【1】Kaggle赛题解读:RSNA 2024 Lumbar Spine Degenerative Classification
赛题名称:RSNA 2024 Lumbar Spine Degenerative Classification 中文:腰椎退行性病变分类 kaggle官网赛题链接:https://www.kaggle ...
- k8s手动安装
一.主节点安装 设置主机名hostnamectl set-hostname masterhostnamectl set-hostname node01 修改hosts文件vim /etc/hosts1 ...
- parser.add_argument
parser.add_argument 在解析参数时,有个地方很值得注意. --dict-name,会把dict-name解析为变量dict_name.也就是说会把破折号转成下划线.
- 合合信息AI图像内容安全新技术亮相WAIC2023,防范“生成式造假”
开年以来,多个图像生成软件在全球迅速蹿红,其作画逼真程度"技惊四座".AI一路"狂飙",让生成.篡改等多形式的图片伪造的门槛变得更低,由此引发的隐患也令人忧虑. ...
- 火山引擎数智平台:高性能ChatBI的技术解读和落地实践
导读:大模型能力的发展和成熟,催生出新一代智能化 BI-- ChatBI,即通过自然语言处理(NLP)与大型语言模型(LLMs)的结合,极大简化数据分析过程,提高效率并降低分析门槛.火山引擎数智平台旗 ...