美高梅平台下载-美高梅娱乐平台登录

热门关键词: 美高梅平台下载,美高梅娱乐平台登录

所谓网站就和现在的world类似,我抱着试一试的心

日期:2019-10-07编辑作者:美高梅娱乐平台登录

十年WEB技术发展历程

2015/07/19 · HTML5 · WEB

原文出处: 红河小鱼   

一个小分享,知识有限,抛砖引玉。

这是一个演讲稿,mark一下

美高梅平台下载 1

ajax

03年的时候我上六年级,那时候网吧刚在小县城的角落萌生。传奇,大话西游第一代网游一时风靡。我抱着试一试的心态给了网吧老板两块钱想申请个号玩玩,然后接下来的一个小时我一直在,注,册,账,号。

彼时网吧用的512k的带宽,注册的时候,填了一堆信息,提交,页面跳转,嘣,”您填写的信息有误,请重填”。然后跳转回注册页面,以此循环。我现在时常想,如果当时ajax能普及开来,我就可以省2块钱了。

那么ajax是什么?

首先ajax是一种技术。以往的网页交互方式,用户在点击一个按钮后,比如提交按钮,用户就要等待漫长的数据和服务器的交互,期间用户无法进行任何操作,只能点根烟。而ajax所做的,就是在向服务器发送请求的时候,我们不必等待结果,而是可以同时做其他的事情,等到有了结果我们可以再来处理这个事

其实ajax技术早在1998年的时候就已经由微软实现了,然而直到2005年2月,Adaptive Path公司的Jesse James Garrett发表文章“Ajax: A New Approach to Web Applications”,人们读了后觉得哎哟不错哦这个屌,这之后ajax才大规模普及开来。

ajax的出现,极大了提高了web的用户体验。时至今日,即使国内IT发展再怎么落后,所有网站的登录注册也已经实现了ajax交互。用户点填写完信息后,页面不用刷新就可以知道信息提交成功与否,哪错改哪。

另外ajax作为一种前后端分离的解决方案,也已经被国内大多数不很low的公司所采用,也间接导致了php等网页脚本语言的衰落。(来辩)

 

1、前端的发展史

43.ajax 的过程是怎样的

  1. 创建XMLHttpRequest对象,也就是创建一个异步调用对象
  2. 创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息
  3. 设置响应HTTP请求状态变化的函数
  4. 发送HTTP请求
  5. 获取异步调用返回的数据
  6. 使用JavaScript和DOM实现局部刷新

  7. 异步加载和延迟加载

  8. 异步加载的方案: 动态插入 script 标签

  9. 通过 ajax去获取 js 代码,然后通过 eval 执行
  10. script 标签上添加defer 或者 async 属性
  11. 创建并插入iframe,让它异步执行 js
  12. 延迟加载:有些js 代码并不是页面初始化的时候就立刻需要的,而稍后的某些情况才需要的

  13. 前端的安全问题?

  14. XSS

  15. sql注入
  16. CSRF:是跨站请求伪造,很明显根据刚刚的解释,他的核心也就是请求伪造,通过伪造身份提交POST和GET请求来进行跨域的攻击

完成CSRF需要两个步骤:

  1. 登陆受信任的网站A,在本地生成 COOKIE
  2. 在不登出A的情况下,或者本地 COOKIE 没有过期的情况下,访问危险网站B。

JQUERY

早年的js编程,代码的效率是极其低下的,这点尤其体现在操作dom上,开发者想要给一个按钮添加事件,要写长长一大段重复的代码去获取到这个按钮,再写长长一大段重复的代码去添加事件。尽管老油条会将常用的操作封装起来,但是对于不会封装的新手,这无疑是很痛苦的一件事,尤其再加上各种各样的兼容。

2006年,本着拯救菜鸟,让他们do more的宗旨,jquery诞生。jQuery诞生的意义,一是对ie6 7 8 及各种割据一方的浏览器做好了兼容,二是极大简化了dom操作,使开发效率大大提升。jquery很火爆,火爆的有些前端只会写jquery而不会写原生js的程度。时至今日,说jquery write once,see everywhere已经不为过了。

jquery的另一个意义(我认为)在于,它催化了人们对前端的兴趣与探索,相比linux,你用很低的成本,就可以写出一个让不懂编程的妹子说欧巴你碉堡了的效果,让人们觉得哎哟(又)不错哦这个屌。此后大量的类库和基于jquey的插件雨后春笋般诞生,前端行业歌舞升平欣欣向荣,网页开发进入一个新时代。

 

1、前端

这是从维基百科上找到的关于前端的定义,一般来说,计算机程序的界面样式,视觉呈现属于前端。
也就是网站mvc结构中的view部分,但是现在说的view层和原来的view层含义已经不一样了,这个待会我们在介绍angular的时候说。

46.ie 各版本和 chrome 可以并行下载多少个资源

  1. IE6 2 个并发
  2. iE7 升级之后的 6个并发,之后版本也是 6 个
  3. Firefox,chrome也是6个

CHROME

天下武功出谷歌。在ie6,7,8的时代里面,尽管Firefox也缓慢的挑战ie的地位。但和2009年开始Google开始推广的chrome浏览器产生的颠覆性影响比起来,逊色很多。Chrome使用Apple的开源内核webkit,良好的设计标准和市场反应;促进浏览器快速迭代,让IE在windows10中彻底消失。

chrome浏览器的推出,将简化前端的入门程度又推进了一步,其自带的调试工具好用又无脑,我们可以利用其轻松的查看网络状态,加载顺序,进行断点调试等,同时谷歌的插件功能,又给开发者提供了极大便利。

目前chrome最新版开始采用blink内核,测试版本中,已经可以对css3动画进行追踪和调试。在我还没有想象到的时候,chrome已经实现了它。

一句话,没有chrome,就没有新中国,就只能用firefox了。

美高梅平台下载,2、前端/互联网的上古时代

前段时间找到了世界上的第一张网页,现在还可以访问,他 http://info.cern.ch/ ,可以看到,所谓网站就和现在的world类似,只有标记语言和超链接,完全没有动效和样式可言。更不用说代码的复用性,以及局部加载。
这是一个伟大的时刻,标志着万维网的诞生,不过站在历史中往前看,就会觉得那个时代简直是洪荒时期,只是把简单的信息传达出去,连刀耕火种的能力都没有达到,。

47.javascript里面的继承怎么实现,如何避免原型链上面的对象共享

用构造函数和原型链的混合模式去实现继承,避免对象共享可以参考经典的extend()函数,很多前端框架都有封装的,就是用一个空函数当做中间变量

GITHUB

随着软件项目的迭代加快,项目版本工具也不断的演进,经历CVS, SVN,GIT。到目前为止CVS差不多已经从互联网行业慢慢消失,SVN作为文件和文档存储存在,由linux内核发明人Linus创建的版本工具GIT现在作为代码版本标准。Github依赖于git成为开发人员团队协作的社区!到2015年1月github上已注册的开发人员超过一千万,开源项目几千万。其中2014中国研发者在github上增⻓长最快。你几乎可以在上面找到一切你想要的代码…比如username..password..

 

3、前端的统一与分割

48. Flash、Ajax各自的优缺点,在使用中如何取舍?

Flash:

  1. Flash适合处理多媒体、矢量图形、访问机器
  2. 对CSS、处理文本上不足,不容易被搜索

Ajax:

  1. Ajax对CSS、文本支持很好,支持搜索
  2. 多媒体、矢量图形、机器访问不足

共同点:

  1. 与服务器的无刷新传递消息
  2. 可以检测用户离线和在线状态
  3. 操作DOM

  4. 请解释一下 JavaScript 的同源策略。

概念:
同源策略是客户端脚本(尤其是Javascript)的重要的安全度量标准。它最早出自NetscapeNavigator2.0,其目的是防止某个文档或脚本从多个不同源装载。
这里的同源策略指的是:协议,域名,端口相同,同源策略是一种安全协议,指一段脚本只能读取来自同一来源的窗口和文档的属性。

为什么要有同源限制:
我们举例说明:比如一个黑客程序,他利用Iframe把真正的银行登录页面嵌到他的页面上,当你使用真实的用户名,密码登录时,他的页面就可以通过Javascript读取到你的表单中input中的内容,这样用户名,密码就轻松到手了。

本文由美高梅平台下载发布于美高梅娱乐平台登录,转载请注明出处:所谓网站就和现在的world类似,我抱着试一试的心

关键词:

美高梅平台下载有了用户系统就会有身份验证,

传统 Web 应用中的身份验证技术 2016/12/13 · 基础技术 ·WEB,身份验证 本文作者: 伯乐在线 -ThoughtWorks。未经作者许可,...

详细>>

登录工程:现代 Web 应用的典型身份验证需求

单点登录:还是需要精心设计 以前,一般只有大型网站、向用户提供多种服务的时候(比如,网易公司运营网易门户...

详细>>

但这也是说明了这门语言正在不断的完善,也不

为未来的你写代码 然后,在 2002 年到 2012 年之间我做了许多项目,大部分都是 web项目,许多是基于 PHP的,不管你相...

详细>>

未经作者许可,先简单介绍一下chrome的控制台

monitor } monitor(sayHello);sayHello('wayou'); unmonitor(sayHello); sayHello('wayou'); 1 2 3 4 5 6 7 function sayHello(name){ alert('hello,'+name); } m...

详细>>