ajax,cookie和localStoragede 的基础知识

今天首先复习了一下ajax(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。
她的核心对象是XMLHTTPRequest,通过ajax可以实现网页的局部刷新。
//判断浏览器类型
function getXmlHttpRequest() {
var xhr = null;
if((typeof XMLHttpRequest) != ‘undefined‘) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject(‘Microsoft.XMLHttp‘);
}
return xhr;
}
onreadystatechange——注册一个监听器(绑定时间处理函数)
readyState返回与服务器通讯状态码Number类型
0对象创建,但是没有初始化
1对象建立但是没有调用
2发送数据(send方法被调用)
3数据传送中
4响应结束
responseText——服务器返回的文本
responseXML——服务器返回的xml dom对象
status 获得状态码
xhr.open(‘get‘,‘students.json‘,true); //打开一个新请求
xhr.status----服务器响应状态 200
xhr.readyState----ajax状态码 4

然后就是cookie和localStorage
localStorage、cookie都是在浏览器端存储的数据
cookie,容量4kb,默认各种浏览器都支持,缺陷就是每次请求,浏览器都会把本机存的cookies发送到服务器,无形中浪费带宽。
优势:所有浏览器都支持,不同目录能共享cookie
弊端:同域内http请求都会带cookie,增加带宽和流量;有个数和大小限制。

localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。
优势:空间更大;操作更方便,有现成的api;更安全;不同目录间也可以访问;清缓存后也存在。
弊端:老版的浏览器都不支持(< ie8)
使用:
window.localStorage.key - 取值
window.localStorage[key] - 取值
window.localStorage.key = value - 设置值
window.localStorage[key] = value - 设置值

window.localStorage.setItem(key,value) - 设置值的方法
window.localStorage.getItem(key) - 取值的方法
window.localStorage.removeItem(key) - 移除一个值
window.localStorage.clear() - 清空所有的值

时间: 2024-10-12 04:20:25

ajax,cookie和localStoragede 的基础知识的相关文章

cookie 和 session 的基础知识

cookie 和session 的区别详解 这些都是基础知识,不过有必要做深入了解.先简单介绍一下. 二者的定义: 当你在浏览网站的时候,WEB 服务器会先送一小小资料放在你的计算机上,Cookie 会帮你在网站上所打的文字或是一些选择, 都纪录下来.当下次你再光临同一个网站,WEB 服务器会先看看有没有它上次留下的 Cookie 资料,有的话,就会依据 Cookie 里的内容来判断使用者,送出特定的网页内容给你. Cookie 的使用很普遍,许多有提供个人化服务的网站,都是利用 Cookie

web基础知识(一)关于ajax传值最基础东西

HTTP方法之 GET对比POST GET:从指定的资源请求数据, POST:向指定的资源提交要被处理的数据 GET方法: 请注意,查询字符串(名称/值对)是在 GET 请求的 URL 中发送的: /test/demo_form.asp?name1=value1&name2=value2 有关 GET 请求的其他一些注释: GET 请求可被缓存 GET 请求保留在浏览器历史记录中 GET 请求可被收藏为书签 GET 请求不应在处理敏感数据时使用 GET 请求有长度限制 GET 请求只应当用于取回

原生ajax基础知识笔记

原生ajax基础知识笔记 1.创建 XMLHttpRequest 对象 所有现代浏览器(IE7+.Firefox.Chrome.Safari 以及 Opera)均内建 XMLHttpRequest 对象. 老版本的 Internet Explorer (IE5 和 IE6)使用 ActiveXObject. 代码示例: // Creates a XMLHttpRequest object. var xhr = new XMLHttpRequest(); 兼容浏览器代码示例: var xhr; /

AJAX 基础知识

AJAX 基础知识 一.AJAX综述 1.AJAX的概念 A:异步asynchronousJ:JavaScriptA:andX:XML 异步的JavaScript和XML. 2.AJAX的优点(好处) 1),提高用户体验度  2),JS与服务端的交互  3),页面局部刷新--提高浏览器的效率 2.AJAX的缺点(弊端)    加大服务器的负担 注:新思想,老技术. 二.实现AJAX功能 (一).JS实现AJAX功能 1.获得XMLHttpRequest(浏览器的兼容) (二).JQuery实现A

web基础知识(二)关于ajax,Jquery传值最基础东西

这次还是一些关于jQuery,ajax前后台传值情况, 是自己在做点小东西过程中遇到的,记录下来为自己也方便别人 列表很多,点击编辑和删除无刷新的进行操作的话,肯定是ajax了,因为无刷新嘛,可能有的朋友会说直接传值,传ID到Action删除不就OK了,用得着写js么,纯粹自己找麻烦嘛. 其实这里重点是无刷新的啦, 这个上传后到这里来,有个预览功能,把本次的全部预览,如果全部刷新的话,那么刚才上传的就不会在这个页面了,so,还是采用无刷新的比较好. 点击编辑跳到一个新的页面的时候有两种方法可以选

Ajax基础知识 浅析(含php基础语法知识)

1.php基础语法    后缀名为.php的文件 (1) echo   向页面中输入字符串  <?php    所有php相关代码都要写在<?php ?>这个标签之中 echo "<div>Hello World!</div>"; ?> (2) $  变量声明  如果只声明不赋值,会报错 <?php $num=123; echo $num; echo "<div>编号为:".$num."&l

web基础知识(三)关于ajax,Jquery传值最基础东西

今天补充一下两个小功能,一个是关于radio单选框的情况,如何在前面选了后,传到后台,编辑修改的时候再次传回来,并且在当时选的那个上:再一个就是关于添加小标签的时候添加接着弹出在下面,并点击出现删除. 一:radio 1 <div class="newlylist"> 2 <div class="newlyhead">图示商品:</div> 3 <div class="newlycontent">&

11月10日上午ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处理页面的,处理页面只是操作数据库并且返回值,页面都是ajax处理的. ajax的写法: test.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR

IM开发基础知识补课(四):正确理解HTTP短连接中的Cookie、Session和Token

本文引用了简书作者“骑小猪看流星”技术文章“Cookie.Session.Token那点事儿”的部分内容,感谢原作者. 1.前言 众所周之,IM是个典型的快速数据流交换系统,当今主流IM系统(尤其移动端IM)的数据流交换方式都是Http短连接+TCP或UDP长连接来实现.Http短连接主要用于从服务器读取各种持久化信息:比如用户信息.聊天历史记录.好友列表等等,长连接则是用于实时的聊天消息或指令的接收和发送. 作为IM系统中不可或缺的技术,Http短连的重要性无可替代,但Http作为传统互联网信