cookie ajax git 相关面试题

2019-07-13 admin

什么是 Ajax? 如何创建一个Ajax?

AJAX(Asynchronous Javascript And XML) = 异步 JavaScript + XML 在后台与服务器进行异步数据交换,不用重载整个网页,实现局部刷新。 创建 ajax 步骤: 1.创建 XMLHttpRequest 对象 2.创建一个新的 HTTP 请求,并指定该 HTTP 请求的类型、验证信息 3.设置响应 HTTP 请求状态变化的回调函数 4.发送 HTTP 请求 5.获取异步调用返回的数据 6.使用 JavaScript 和 DOM 实现局部刷新 var xhr = new XMLHttpRequest(); xhr.open(“POST”, url, true); xhr.setRequestHeader(“Content-type”, “application/x-www-form-urlencoded”); xhr.onreadystatechange = function () {

if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 304)) {
    fn.call(this, xhr.responseText);
}

}; xhr.send(data);

sessionStorage、localStorage和cookie的区别

共同点:都是保存在浏览器端、且同源的 区别: 1、cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递,而sessionStorage和localStorage不会自动把数据发送给服务器,仅在本地保存。cookie数据还有路径(path)的概念,可以限制cookie只属于某个路径下 2、存储大小限制也不同,cookie数据不能超过4K,同时因为每次http请求都会携带cookie、所以cookie只适合保存很小的数据,如会话标识。sessionStorage和localStorage虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大 3、数据有效期不同,sessionStorage:仅在当前浏览器窗口关闭之前有效;localStorage:始终有效,窗口或浏览器关闭也一直保存,因此用作持久数据;cookie:只在设置的cookie过期时间之前有效,即使窗口关闭或浏览器关闭 4、作用域不同,sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面;localstorage在所有同源窗口中都是共享的;cookie也是在所有同源窗口中都是共享的 5、web Storage支持事件通知机制,可以将数据更新的通知发送给监听者 6、web Storage的api接口使用更方便

web Storage和Cookie的区别

Web Storage的概念和cookie相似,区别是它是为了更大容量存储设计的,cookie的大小是受限的,并且每次请求一个新的页面的时候cookie都会被发送过去,这样无形中浪费了带宽,另外cookie还需要指定作用域,不可跨域调用。 除此之外,web storage拥有setItem,getItem,removeItem,clear等方法,不像cookie需要前端开发者自己封装setCookie,getCookie。 但是cookie也是不可或缺的,cookie的作用是与服务器进行交互,作为http规范的一部分而存在的,而web Storage仅仅是为了在本地“存储”数据而生 sessionStorage、localStorage、cookie都是在浏览器端存储的数据,其中sessionStorage的概念很特别,引入了一个“浏览器窗口”的概念,sessionStorage是在同源的同窗口中,始终存在的数据,也就是说只要这个浏览器窗口没有关闭,即使刷新页面或进入同源另一个页面,数据仍然存在,关闭窗口后,sessionStorage就会被销毁,同时“独立”打开的不同窗口,即使是同一页面,sessionStorage对象也是不同的 Web Storage带来的好处: 1、减少网络流量:一旦数据保存在本地之后,就可以避免再向服务器请求数据,因此减少不必要的数据请求,减少数 据在浏览器和服务器间不必要的来回传递 2、快速显示数据:性能好,从本地读数据比通过网络从服务器上获得数据快得多,本地数据可以及时获得,再加上网 页本身也可以有缓存,因此整个页面和数据都在本地的话,可以立即显示 3、临时存储:很多时候数据只需要在用户浏览一组页面期间使用,关闭窗口后数据就可以丢弃了,这种情况使用sessionStorage非常方便

[转载]原文链接:https://segmentfault.com/a/1190000019748611

本站文章除注明转载外,均为本站原创或编译。欢迎任何形式的转载,但请务必注明出处。

转载请注明:文章转载自 JavaScript中文网 [https://www.javascriptcn.com]

本文地址:https://www.javascriptcn.com/read-69638.html

文章标题:cookie ajax git 相关面试题

相关文章
jquery拼接ajax 的json和字符串拼接的方法
整理文档,搜刮出一个jquery拼接ajax 的json和字符串拼接的代码,稍微整理精简一下做下分享。 jQuery拼接字符串ajax <form id="myForm" action="#"&...
2017-04-01
ajax教程之ajax使用Http请求
ajax中是如何让使用http请求的呢? 在传统的JS编程中,如果您希望从服务器上的文件或数据库中得到任何的信息,或者向服务器发送信息的话,就必须利用一个 HTML 表单向服务器 GET 或 POST 数据。而用户则需要单击“提交”按钮来发...
2015-11-12
自己参考两个仓库撸的通用的vue2.0+elementUI+多页面模板
A modern Vue.js multiple pages cli which uses Vue 2, Webpack3, and Element-UI Features Vue2 Webpack3 ElementUI Eslint(e...
2018-01-12
Ajax入门手册chm
下载地址:Ajax入门手册chm ...
2015-11-12
详解使用vue-router进行页面切换时滚动条位置与滚动监听事件
按照正常的产品逻辑,我们在进行页面切换时滚动条应该是在页面顶部的,可是。。。在使用vue-router进行页面切换时,发现滚动条所处的位置被自动记录了下来,且在另一个组件内定义的滚动监听事件仍会运行,着实吃了一大惊。。。 说说我的破解方法:...
2017-03-13
ajax分页效果(bootstrap模态框)
ajax分页效果图: 上干货: /** * ajax分页 */ $(function(){ $(".modal-body").find(".pagination"...
2017-02-20
Ajax教程之Ajax介绍
Ajax 由 HTML、JavaScript™ 技术、DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。本文的作者是一位 Ajax 专家,他演示了这些技术如何协同工作 —— 从总体概述...
2015-11-12
JavaScript实现模仿桌面窗口的方法
本文实例讲述了JavaScript实现模仿桌面窗口的方法。分享给大家供大家参考。具体如下: 这里使用JS模仿了桌面窗口的移动、八个方向的缩放、最小化、最大化和关闭,以及 双击缩小放大窗口、改变窗口大小的预览效果等功能。 <!DOCTY...
2017-03-27
javascript实现给定半径求出圆的面积
代码相当简单,这里就不多废话了,小伙伴们自己参考下吧。 <script> var circularityArea = new Function("r","return r*r*Math.PI&quo...
2017-03-25
bootstrap实现的自适应页面简单应用示例
本文实例讲述了bootstrap实现的自适应页面简单应用。分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset='u...
2017-03-14
回到顶部