HTML5 有哪些新个性?

  • HTML5 当初曾经不是 SGML 的子集,次要是对于图像,地位,存储,多任务等性能的减少。
  • 拖拽开释(Drag and drop) API
    语义化更好的内容标签(header,nav,footer,aside,article,section)
    音频、视频API(audio,video)
    画布(Canvas) API
    天文(Geolocation) API
    本地离线存储 localStorage 长期存储数据,浏览器敞开后数据不失落;sessionStorage 的数据在浏览器敞开后主动删除
    表单控件,calendar、date、time、email、url、search
    新的技术webworker, websocket, Geolocation
  • 移除的元素
    纯体现的元素:basefont,big,center,font, s,strike,tt,u;
    对可用性产生负面影响的元素:frame,frameset,noframes;
    反对HTML5新标签:
  • IE8/IE7/IE6反对通过document.createElement办法产生的标签,
    能够利用这一个性让这些浏览器反对HTML5新标签,
    浏览器反对新标签后,还须要增加标签默认的款式:
  • 当然最好的形式是间接应用成熟的框架、应用最多的是html5shim框架
    <!--[if lt IE 9]>
    <script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
    <![endif]-->
      如何辨别: DOCTYPE申明\新增的构造元素\性能元素

Doctype作⽤? 严格模式与混淆模式如何辨别?它们有何意义?

一、Doctype作用是什么?
<!DOCTYPE>申明叫做文件类型定义(DTD),申明的作用为了通知浏览器该文件的类型。让浏览器解析器晓得应该用哪个标准来解析文档。<!DOCTYPE>申明必须在 HTML 文档的第一行,这并不是一个 HTML 标签。

二、严格模式和混淆模式的如何辨别?他们有什么意义?
规范模式(严格模式)的排版和JS运作模式都是以该浏览器反对的最高规范运行。

在兼容模式(混淆模式或怪异模式)中,页面以宽松的向后兼容的形式显示,模仿老式浏览器的行为以避免站点无奈工作。

如何实现浏览器内多个标签页之间的通信?

一、调用localStorage

在一个标签页外面应用localStorage.setItem(key,value)增加(批改、删除)内容;在另一个标签页外面监听storage事件。通过localstorge.getItem(key)存储的值,实现不同标签页之间的通信。

二、调用cookie+setInterval()

将要传递的信息存储在cookie中,每隔肯定工夫读取getCookie获取信息,即可随时获取要传递的信息。

行内元素有哪些?块级元素有哪些?空(void)元素有哪些?行内元素和块级元素有什么区别?

行内元素有: a、b、span、img、input、select、strong

块级元素有: div、ul、ol、li、dl、dt、dd、h1、h2、h3、h4、 p

空元素: br、hr、img、input、link、meta

    区别:

行内元素不能够设置宽高,不独占整行

块级元素能够设置宽高,独占整行

简述一下src与href的区别?

src用于替换以后元素;href用于在以后文档和援用资源之间确立分割。

src是source的缩写,指向内部资源的地位,指向的内容将会嵌入到文档中以后标签所在位置

href是Hypertext Reference的缩写,指向网络资源所在位置,建设和以后元素(锚点)或以后文档(链接)之间的链接

<script src ="js.js"></script>

<link href="common.css" rel="stylesheet"/>

浏览器本地存储 cookies,sessionStorage,localStorage 的区别?

在较高版本的浏览器中,js提供了sessionStorage和globalStorage。在HTML5中提供了localStorage来取代globalStorage。

html5中的Web Storage包含了两种存储形式:sessionStorage和localStorage。

sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面能力拜访并且当会话完结后数据也随之销毁。因而sessionStorage不是一种长久化的本地存储,仅仅是会话级别的存储。

而localStorage用于长久化的本地存储,除非被动删除数据,否则数据是永远不会过期的。

web storage和cookie的区别
Web Storage的概念和cookie类似,区别是它是为了更大容量存储设计的。Cookie的大小是受限的,并且每次你申请一个新的页面的时候Cookie都会被发送过来,这样无形中节约了带宽,另外cookie还须要指定作用域,不能够跨域调用。

除此之外,Web Storage领有setItem,getItem,removeItem,clear等办法,不像cookie须要前端开发者本人封装setCookie,getCookie。

然而cookie也是不能够或缺的:cookie的作用是与服务器进行交互,作为HTTP标准的一部分而存在 ,而Web Storage仅仅是为了在本地“存储”数据而生

浏览器的反对除了IE7及以下不反对外,其余规范浏览器都齐全反对(ie及FF需在web服务器里运行),值得一提的是IE总是办好事,例如IE7、IE6中的userData其实就是javascript本地存储的解决方案。通过简略的代码封装能够对立到所有的浏览器都反对web storage。

localStorage和sessionStorage都具备雷同的操作方法,例如setItem、getItem和removeItem等
cookie 和session 的区别:
1、cookie数据寄存在客户的浏览器上,session数据放在服务器上。
2、cookie不是很平安,他人能够剖析寄存在本地的COOKIE并进行COOKIE坑骗

思考到平安该当应用session。

3、session会在肯定工夫内保留在服务器上。当拜访增多,会比拟占用你服务器的性能

思考到加重服务器性能方面,该当应用COOKIE。

4、单个cookie保留的数据不能超过4K,很多浏览器都限度一个站点最多保留20个cookie。
5、所以集体倡议:

将登陆信息等重要信息寄存为SESSION其余信息如果须要保留,能够放在COOKIE中

XML和JSON的区别?

(1).数据体积方面。

JSON绝对于XML来讲,数据的体积小,传递的速度更快些。

(2).数据交互方面。

JSON与JavaScript的交互更加不便,更容易解析解决,更好的数据交互。

(3).数据形容方面。

JSON对数据的描述性比XML较差。

(4).传输速度方面。

JSON的速度要远远快于XML。

浏览器是如何渲染页面的?

iframe 的优缺点?

iframe的长处:

1.iframe可能一成不变的把嵌入的网页展示进去。

2.如果有多个网页援用iframe,那么你只须要批改iframe的内容,就能够实现调用的每一个页面内容的更改,方便快捷。

3.网页如果为了对立格调,头部和版本都是一样的,就能够写成一个页面,用iframe来嵌套,能够减少代码的可重用。

4.如果遇到加载迟缓的第三方内容如图标和广告,这些问题能够由iframe来解决。

iframe的毛病:

1.会产生很多页面,不容易治理。

2.如果框架个数多的话,可能会呈现高低、左右滚动条,用户体验度差。

3.代码简单,无奈被一些搜索引擎索引到,应用iframe会不利于搜索引擎优化。

4.很多的挪动设施(PDA 手机)无奈齐全显示框架,设施兼容性差。

5.iframe框架页面会减少服务器的http申请,对于大型网站是不可取的。

Canvas 和 SVG 图形的区别是什么?

1.什么是Canvas?

Canvas 是H5新进去的标签

Canvas画布,利用JavaScript在网页绘制图像

2.什么是SVG?

SVG 可缩放矢量图形(Scalable Vector Graphics),基于可扩大标记语言XML

谈一谈meta 标签?
meta标签是用来形容一个HTML网页文档的属性,比方该网页的作者,日期,网页的关键字,刷新,网页等级设定等等

meta标签能够分为两大部分:

  • http-equiv: http题目信息
  • name:页面形容信息

    http-equiv 相似于http的头部协定,作用是回应给浏览器一些有用的信息来帮忙正确准确的显示网页内容。罕用的http-equiv 类型有:Content-Type 和 Content-Language(显示字符集的设定)。