奔三路 - 你30岁前的学习路!

奔三路学习网

当前位置: 主页 > 前端面试通 > 笔经面经 >

Web前端面试笔记(HTML相关知识)

时间:2017-10-31 21:23来源:百面网 作者:
1. HTML5 ,以及与html的差别1). 语义化标签2). 支持视频和音频3). Doctype类型-简单,它能在每一个浏览器中正常工作

1. HTML5 ,以及与html的差别

1). 语义化标签

2). 支持视频和音频

3). Doctype类型-简单,它能在每一个浏览器中正常工作即使是名声狼藉的IE6。

4). 离线存储 - localStorage和sessionStorage

5). 互动效果

a. canvas

b. 更多API支持更好的用户体验- 拖拽、地图、利用Native

6). 丰富的表单控件 如 calendar、date、time、email、url、search

7). 移动端-摆脱对平台依赖

2. doctype(文档类型) 的作用是什么

 

  现代浏览器包括不同的呈现模式,目的是既支持遵循标准的网页,也支持为老式浏览器而设计的网页。其中, Standards (标准)模式(也就是严格呈现模式)用于呈现遵循最新标准的网页,而 Quirks (包容)模式(也就是松散呈现模式或者兼容模式)用于呈现为传统浏览器而设计的网页。另外,注意Mozilla/Netscape 6新增了一种 Almost Standards (近似标准)模式,用于支持为标准的某个老版本而设计的网页。

 

  doctype声明指出阅读程序应该用什么规则集来解释文档中的标记。在Web文档的情况下,“阅读程序”通常是浏览器或者校验器这样的一个程序,“规则”则是W3C所发布的一个文档类型定义(DTD)中包含的规则。

 

3. localStorage和sessionStorage

 

  localStorage有效期为永久,sessionStorage有效期为顶层窗口关闭前同源文档可以读取并修改localStorage数据,sessionStorage只允许同一个窗口下的文档访问,如通过iframe引入的同源文档。

 

 Storage对象通常被当做普通javascript对象使用:通过设置属性来存取字符串值,也可以通过setItem(key, value)设置,getItem(key)读取,removeItem(key)删除,clear()删除所有数据,length表示已存储的数据项数目,key(index)返回对应索引的key

代码如下:

 

localStorage.setItem(‘x’, 1); // storge x->1

localStorage.getItem(‘x); // return value of x

 

// 枚举所有存储的键值对

for (var i = 0, len = localStorage.length; i < len; ++i ) {

    var name = localStorage.key(i);

    var value = localStorage.getItem(name);

}

 

localStorage.removeItem(‘x’); // remove x

localStorage.clear();  // remove all data

 

4. 应用程序存储和离线web应用

 

HTML5新增应用程序缓存,允许web应用将应用程序自身保存到用户浏览器中,用户离线状态也能访问。 1.为html元素设置manifest属性:<html manifest=”myapp.appcache”>,其中后缀名只是一个约定,真正识别方式是通过text/cache-manifest作为MIME类型。所以需要配置服务器保证设置正确 2.manifest文件首行为CACHE MANIFEST,其余就是要缓存的URL列表,每个一行,相对路径都相对于manifest文件的url。注释以#开头 3.url分为三种类型:CACHE:为默认类型。NETWORK:表示资源从不缓存。 FALLBACK:每行包含两个url,第二个URL是指需要加载和存储在缓存中的资源, 第一个URL是一个前缀。任何匹配该前缀的URL都不会缓存,如果从网络中载入这样的URL失败的话,就会用第二个URL指定的缓存资源来替代。以下是一个文件例子:

 

CACHE MANIFEST

 

CACHE:

myapp.html

myapp.css

myapp.js

 

FALLBACK:

videos/ offline_help.html

 

NETWORK:

cgi/

 

5.简述一下你对HTML语义化的理解

 

用正确的标签做正确的事情。

html语义化让页面的内容结构化,结构更清晰,便于对浏览器、搜索引擎解析;

及时在没有样式CCS情况下也以一种文档格式显示,并且是容易阅读的;

搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重,利于SEO;

使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。

(责任编辑:admin)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
发布者资料
史密斯 查看详细资料 发送留言 加为好友 用户等级:注册会员 注册时间:2017-11-24 11:11 最后登录:2018-09-02 11:09

关注奔三路