共计 2938 个字符，预计需要花费 8 分钟才能阅读完成。
1、简述一下 HTML5 新个性
1）减少了 section footer header nav 等自定义语义化标签
2）减少了表单输入框新 time color number tel search 等个性
3）提供了视频音频标签
4）增加了 canvas 绘画性能
5）反对展现 SVG 矢量图形
6）应用 getCurrentPosition() 办法获取以后终端地理位置
7）提供 drag 拖拽，任何元素都能被拖拽
8）webStorage 是 HTML5 最风行的缓存之一
sessionStorage 缓存是基于浏览器会话的缓存，敞开浏览器就会革除缓存
localStroage 缓存没有工夫限度，只能手动革除
9）提供 WebSocket 全双工通信机制
客户端与服务器单方握手采纳 http 协定，默认 80、443 端口
没有同源限度，任何客户端能够与服务器通信，罕用于长期社交通信，例如聊天室
10）WebWork
WebWork 基本原理是在以后 JavaScript 主线程中，加载一个 js 文件从而创立一个新线程
目标为了起到相互不阻塞运行其余脚本文件
WebWork 线程与主线程之间能够实现数据传输
var webWorker =new Worker("webWorker.js");
webWorker.postMessage("主线程发送的数据");
webWorker.onmessage = function(event){console.log(event)
}2、讲述一下 js 的循环有哪些形式
// 传统的 for 循环形式
for(var i = 0;i < 20;i++){console.log(i);// 输入索引
}
// ES6for 形式，用于循环 json 对象
var arr = [{b:2},{c:3}];
for(var i in arr){console.log(i);// 输入索引
console.log(arr[i]);// 输入对象值 1,2,3
}
// ES5foreach 循环获取 key、value，但过程中不能跳出循环
var array = ['1','2','3'];
array.forEach((currentValue, index, arr)=>{console.log(currentValue); // 输入 1,2,3
console.log(index); // 输入索引
console.log(arr); // 输入 arr 数组自身
})3、浏览器及浏览器内核
IE 浏览器：Trident 内核
Chrome 谷歌：之前始终都是和苹果共用 Webkit 内核，当初的谷歌浏览器是 Blink 内核，Blink 是在 webkit 根底上衍生而来的
Firefox 火狐：Gecko 内核
Safari 苹果浏览器：Webkit 内核
Opera 欧朋浏览器：由 Presto 内核，转成 Webkit 内核，再转成 Blink 内核
360、搜狗、漫游、QQ 等一系列浏览器基本上为 Trident（兼容模式）+Webkit（高速模式）双核浏览器
4、不同浏览器有不同兼容问题，如何解决？
兼容性问题太多，此处列举 3 处
1）默认内外边距的不同，设置通配符选择器
*{margin:0;padding:0;}2）在 IE6、7 中设置 float 浮动再设置 margin 后，会呈现双边距景象，如何解决？
.dom{display:inline;}3）margin 边距重叠问题
高低两 div 之间别离设置 5px、10px
量元素之间的间距造成重叠为 10px
解决：两元素最好给下面的元素设置 margin-bottom
或者将元素再套一层 div，再设置 margin
5、HTML 网页的造成过程
浏览器先解析 html 源代码，生成一个 DOM 树，再解析 css 代码，计算出款式数据，两者合为渲染树，再由浏览器将渲染树绘制到浏览器页面中
6、jQuery 异步接口申请代码
get 是从服务器上获取数据，post 是向服务器传送数据
get 参数通过地址栏传递，post 放在 request body 中
get 申请只能进行 encodeURI 编码，而 post 反对多种编码方式
get 传送的数据量较小，不能大于 2KB。post 传送的数据量较大，个别被默认为不受限制
get 参数类型只承受 ASCII 字符串类型，而 post 没有限度
get 安全性非常低，可间接裸露在地址栏中，post 安全性较高
get 在浏览器回退时是有害的，而 post 会再次提交申请
get 申请会被浏览器被动 cache，而 post 不会，除非手动设置
$.ajax({
type: "POST",
url: "http://xxxxxx.com/requestUrl",
data: {name:$("#name").val(),}, dataType: "json",
success: function(result,status,xhr){
// 输入申请胜利返回后果
console.log(result);
},
error:function(xhr,status,error){// 输入申请失败回调}})7、长度有哪些单位
px
% 百分比
em
rem
vw、vh
8、盒模型了解
盒模型包含：content 内容体、padding 内边距、border 边框、margin 外边距
9、革除浮动形式
父级元素增加 overflow:hidden;
子级元素增加 <div style=”clear:both;”></div>
10、图片的 title 和 alt 有什么区别？
alt 是图片加载失败时，在网页上显示的代替文字
title 是鼠标放在图片上显示的提醒文字
11、相对定位和绝对定位的区别？
position:absolut
相对定位：以后元素是绝对于最近定位的先人元素进行定位
position:relative
绝对定位：以后元素是绝对于该元素的初始地位进行挪动
12、display:inline-block 怎么不显示间隙？
margin 设置负值
或者父级元素设置 font-size:0
13、垂直居中有哪些办法？
单行文本垂直居中能够把 hight 和 ilne-hight 设置雷同的高度值
块级元素能够应用子绝父相 + 指定高度解决，例如：
父元素设置 position:relative; 子元素设置 hight :10px;position:absolute;top:50%;margin-top:-5px;
或者应用子绝父相 +transform，不必指定高度也能够解决，例如：
父元素设置 position:relative; 子元素设置 position:absolute;top:50%;transform:translate (0 -50%);
14、程度居中有哪些办法？
行内元素能够设置父元素 text-align:center;
元素宽度固定时，也能够设置元素的左右 margin 值为 auto
子元素为相对定位时，能够设置父元素绝对定位，子元素设置 left:0;right:0;margin:auto;
15、content 属性有什么作用？能够怎么利用？
content 属性用在 before 和 after 伪类元素里，用来生成插入内容；常见的利用是作用在伪类元素里革除浮动
16、CSS 优先级怎么确定？
优先级关系：
!important> 内联款式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器
存在多个优先级时，相加计算比拟；优先级雷同时，显示后写的款式；
