前端知识点总结---面试专用
1.关于基础css html js部分
1.1基本算法
1）快速排序
时间复杂度 nlognjavascript
function quickSort(arr){
if (arr.length<=1){
return arr;
}
var pivotIndex = 0,
pivort = arr.splice(pivortIndex, 1)[0];
var left = [],
right = [];
for (var i = 1, length = arr.length; i < length; i++) {
if (arr[i] < pivort) {
left.push(arr[i]);
}else if (arr[i] > = pivort) {
right.push(arr[i]);
}
}
return quickSort(left).concat([pivort], quickSort(right));
}
2) 二分查找算法
时间复杂度：logn(以2为底n的对数)css
二分查找的基本思想是将n个元素分红大体相等的两部分，去a[n/2]与x作比较，若是x=a[n/2],则找到x,算法停止；若是x<a[n/2],则只要在数组a的左半部分继续搜索x,若是x>a[n/2],则只要在数组a的右半部搜索x. 时间复杂度无非就是while循环的次数！ 总共有n个元素， 渐渐跟下去就是n,n/2,n/4,....n/2^k，其中k就是循环的次数 因为你n/2^k取整后>=1 即令n/2^k=1 可得k=log2n,（是以2为底，n的对数） 因此时间复杂度能够表示O()=O(logn)
function binarySearch (arr, value) {
var low = 0,
high = arr.length - 1,
mid;
while (low <= high) {
mid = Math.floor((low + high)/2);
if (arr[mid] == value) {
return mid;
}else if (arr[mid] < value) {
low = mid +1;
}else if (arr[mid] > value) {
high = mid -1;
}else {
return -1;
}
}
}
3)单向链表反转
依次将第2---N个节点逐次插入到第一个节点后，最后将第一个节点挪到新表的结尾html
例子为单向链表，头结点为空前端
时间复杂度：Nvue
function reverse (list) {
//空链表
if (list.head.next == null) {
return list;
}
//非空链表
var p = list.head.next,
q;
while (p.next !== null) {
q = p.next;
p.next = q.next;
q.next = list.head.next;
list.head.next = q;
}
return list;
}
4)查找单向链表的倒数第K个节点
function searchK (list, k) {
var head = list.head;
if (head == null || k == 0) {
return null;
}
//第一个节点先向前走K-1步
var firstNode = head;
for (var i = 0; i < k-1; i++) {
firstNode = firstNode.next;
}
//判断链表长度是否有K长
if (i!== k-1) {
return null;
}
//两个节点同时走
var secondNode = head;
while (firstNode.next !== null) {
secondNode = secondNode.next;
firstNode = firstNode.next;
}
return secondNode;
}
5)深度克隆
function clone (test) {
if (Array.isArray(test)) {
var arr = [];
for (var i = 0, length = test.length; i < length; i++) {
arr.push(clone(arr[i]));
}
}else if (typeOf test === "object") {
var obj = {};
for (var j in test) {
obj[j] = clone(test[j]);
}
return obj;
}else {
return test;
}
}
6)数组去重
例如去重['1',1,2,2,NaN,NaN,null,undefined]html5
尤为注意1，'1'java
NaNnode
function _isNaN (value) {
return typeof value === 'number' && isNaN(value);
}
function unique (arr) {
var type = '',
key = '',
res = [],
hash = {};
for(var i= 0,len=arr.length;i<len;i++){
if(_isNaN(arr[i])){
if(!hash[arr[i]]){
hash['NaN'] = true;
res.push(arr[i]);
}
}else{
type = typeof arr[i];
key = type + arr[I];
if(!hash[key]){
hash[key] = true;
res.push(arr[i]);
}
}
}
return res;
}
7）两个栈实现一个队列
https://segmentfault.com/a/11...jquery
1.2 replace,match,search正则匹配是string的方法
str.replace(/ /g,'20%'); g表示全局匹配，不会匹配完第一个就不匹配了 i忽略大小写 m多行匹配
1.3 Rexg正则匹配test,exec
test,返回一个 Boolean 值，它指出在被查找的字符串中是否存在模式。 若是存在则返回 true，不然就返回 false。 exec,用正则表达式模式在字符串中运行查找
var str=" 12 er 45 ;; ";var rexg=/ /;rexg.exec(str); Array[1] 0: " " index: 0 input: " 12 er 45 ;; " length: 1 __proto__: Array[0]
var str=" 12 er 45 ;; ";var rexg=/ /;rexg.exec(str); [" "]0: " "index: 0input: " 12 er 45 ;; "length: 1__proto__: Array[0] var str=" 12 er 45 ;; ";str.match(/ /g,'20%'); [" ", " ", " ", " ", " "] var str=" 12 er 45 ;; ";str.replace(/ /,'20%'); "20%12 er 45 ;; " var str=" 12 er 45 ;; ";str.match(/ /,'20%'); [" "] var str=" 12 er 45 ;; ";str.search(/ /,'20%'); 0 var str=" 12 er 45 ;; ";str.search(/ /g,'20%'); 0 var str=" 12 er 45 ;; ";var rexg=/ /;rexg.test(str); true
1.4 闭包
定义：linux
- 能够访问外部函数做用于中变量的函数
- 被内部函数引用的外部函数的变量保存在外部做用域中而不被回收
优缺点：
优势：
变量私有化
减小全局变量污染
可让一个变量常驻内存
缺点：
内存泄漏
闭包会携带包含它的函数的做用域，所以会比其余函数占用更多的内存
1.5 js数组
数组能够当栈用：
arr.unshift(val)进栈，依次向前插入 arr.pop()出栈 取得数组最后一项,原数组改变减小最后一项 实现了先进后出
数组当队列或者正常数组用：
arr.push(val),顺序添加 arr.shift(),抛出第一个值即arr[0]，原数组改变减小第一项
2.关于JS延迟加载
JS延迟加载的方式：
1.位置，js放在</body>结束标签前
2.监听，window.onload后再添加script标签
3.属性，为script标签添加属性defer或async
4.ajax下载js脚本后eval()执行
3.defer和async的比较
3.1 defer="defer"，defer默认false: 该属性用来通知浏览器，这段脚本代码将不会产生任何文档内容。 例如 JavaScript代码中的document.write()方法将不会骑做用,浏览器遇到这样的代码将会忽略，并继续执行后面的代码。 属性只能是 defer，与属性名相同。 在HTML语法格式下，也容许不定义属性值，仅仅使用属性名。 3.2 async="true/false",只写async省略属性值的状况下为true: 该属性为html5中新增的属性，它的做用是可以异步地下载和执行脚本，不由于加载脚本而阻塞页面的加载。 一旦下载完毕就会马上执行。 加上defer 等于在页面彻底载入后再执行，至关于文档载入后即执行，不用等包括图片在内的资源下载完毕。 async和defer同样，都不会阻塞其余资源下载，因此不会影响页面的加载， 但在async的状况下，js文档一旦下载完毕就会马上执行，因此颇有可能不是按照本来的顺序来执行，若是js有依赖性，就要注意了。 3.3 相同点： 加载文件时不阻塞页面渲染； 使用这两个属性的脚本中不能调用document.write方法； 容许不定义属性值，仅仅使用属性名； 3.4 不一样点： html的版本html4.0中定义了defer；html5.0中定义了async；这将形成因为浏览器版本的不一样而对其支持的程度不一样； 执行时刻：每个async属性的脚本都在它下载结束以后马上执行，同时会在window的load事件以前执行。 因此就有可能出现脚本执行顺序被打乱的状况； 每个defer属性的脚本都是在页面解析完毕以后，按照本来的顺序执行，同时会在document的DOMContentLoaded以前执行。 3.5 混合用 若是async为true，那么脚本在下载完成后异步执行。 若是async为false，defer为true，那么脚本会在页面解析完毕以后执行。 若是async和defer都为false，那么脚本会在页面解析中，中止页面解析，马上下载而且执行。
4.关于ajax
var xhr = new XMLHttpRequest(); IE new ActiveXObject("Microsoft.XMLHTTP");
1.xhr.open()
三个参数： 1）请求方式，post/get 2）请求的URL 3）是否发送异步请求 true/false
注意： 只是启动，并未发送请求，要调用send
2.xhr.send()
一个参数：必须有 参数为http请求的主体 post请求通常传入 get请求必须传入null
发送后获得服务器的响应，响应的数据会自动填充xhr的属性
responseText,响应主体 responseXML status，http状态码 statusText，状态说明
3.xhr.readyState
如何判断服务器响应已到位，如何判断响应所处阶段
xhr.readyState:0,1,2,3,4 4表示完成，收到所有响应
4.xhr.status
((status >= 200 && status <300) || status = = = 304 ) 表示请求成功
5.xhr.onreadystatechange事件
readyState改变一次，onreadystatechange事件触发一次
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
try {
if((xhr.status >= 200 && xhr.status <300) || xhr.status == 304){
console.log(xhr.responseText);
}else{
console.log("erro:" + xhr.status);
}
}catch(ex){
//ontimeout处理
}
}
};
xhr.open("get","example.js",true);//异步
xhr.send(null);
6.对GET,POST请求参数的处理
GET
1) encodeURIComponent()对参数键和值进行编码，保证格式正确 2) 键=值对之间以 & 分隔
function addURLParam(url,name,value){
url + = (url.indexOf("?") = = -1 ? "?" : "&");
url + = encodeURIComponent(name) + "=" + encodeURIComponent(value);
return url;
}
POST
XMLHttpRequest 1级的实现：
1）Content-Type的设置：xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
2）serialize()序列化数据
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
try {
if((xhr.status >= 200 && xhr.status <300) || xhr.status == 304){
console.log(xhr.responseText);
}else{
console.log("erro:" + xhr.status);
}
}catch(ex){
//ontimeout处理
}
}
};
xhr.open("post",url,true);//异步
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
var form = document.getElementById("exampleID");
xhr.send(serialize(form));
XMLHttpRequest 2级
增长了FormData:没必要明确头部类型
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
try {
if((xhr.status >= 200 && xhr.status <300) || xhr.status == 304){
console.log(xhr.responseText);
}else{
console.log("erro:" + xhr.status);
}
}catch(ex){
//ontimeout处理
}
}
};
xhr.open("post",url,true);//异步
var form = document.getElementById("exampleID");
xhr.send(new FormData(form));
7.XMLHttpRequest 2 级
xhr.timeout = 属性值
xhr.ontimemout = function(){
console.log("超时未收到响应");
};
在规定时间内浏览器未收到响应就触发 ontimeout 事件
5.关于web存储
5.1 cookie,sessionStorage,localStorage区别？
sessionStorage,loalStorage统称webStorage; Cookie的做用是与服务器进行交互,做为HTTP规范的一部分而存在,而Web Storage仅仅是为了在本地“存储”数据而生
（1）存储大小：
cookie,4k; sessionStorage,localStorage,5M或更大;
（2）过时时间：
cookie,过时时间前一直有效，默认cookie（没有设置expires的cookie）失效时间直到关闭浏览器，设置方式
保留COOKIES一个小时------Response.Cookies("MyCookie").Expires = DateAdd("h", 1, Now());
sessionStorage关闭即删除，只要同源的同学口（或tab）中，刷新页面或进入同源的不一样页面，数据始终存在
loalStorage永不丢失
（3）服务器交互带宽使用状况：
cookie放在请求头发送给服务端，浪费带宽
sessionStorage,loalStorage无于服务端交互
（4）存储位置：
cookie以键值对形式存储在http请求的header中发送给服务端，同时从服务端得到的cookie是 键=值分号隔开的形式存储
sessionStorage,localStorage存储在本地
（5）共享：
cookie受同源策略限制
sessionStorage同一窗口共享
localStorage受同源限制
（6）用法：
cookie须要本身封装方法
* escape()函数是JS内置函数，编码将字符串编码为16进制，unescape()解码
1．添加一个cookie
<script language="JavaScript" type="text/JavaScript">
<!--
function addcookie(name,value,expireHours){
var cookieString=name+"="+escape(value);
//判断是否设置过时时间
if(expireHours>0){
var date=new Date();
date.setTime(date.getTime()+expireHours*3600*1000);
cookieString=cookieString+"; expire="+date.toGMTString();
// 或者cookieString+=";max-age="+60*5; /* 设置cookie的有效期为5分钟 */
}
document.cookie=cookieString;
}
//-->
</script>
2．获取指定名称的cookie值：getcookie(name)
该函数返回名称为name的cookie值，若是不存在则返回空，其实现以下：
<script language="JavaScript" type="text/JavaScript">
<!--
function getcookie(name){
var strcookie=document.cookie;
var arrcookie=strcookie.split(";");
for(var i=0，len=arrcookie.length;i<len;i++){
var arr=arrcookie[i].split("=");
if(arr[0]==name)return unescape(arr[1]);
}
return "";
}
//-->
</script>
3．删除指定名称的cookie：deletecookie(name)
该函数能够删除指定名称的cookie，其实现以下：
<script language="JavaScript" type="text/JavaScript">
<!--
function deletecookie(name){
var cookieValue = getCookie(name);
var cookieString = null;
if(cookieValue！== "" || cookieValue!==null){
cookieString = name + "=" + escape(cookieValue) + ";max-age=" + 0;
}
document.cookie = cookieString;
}
//-->
</script>
cookie 的属性：Domain(设置子域该域下才可访问cookie) HttpOnly(设置后将不能用JS脚本操做cookie), Secure(设置后将只能经过HTTPS协议访问), Expiress（过时时间，不设置默认关闭浏览器cookie失效）,目前已被max-age属性所取代 max-age用秒来设置cookie的生命周期 Path（设置路径的页面才可访问cookie）
sessionStorage,localStorage有接口：
setItem,getItem,removeItem,clear
例如清除全部的key/value
sessionStorage.clear(); localStorage.clear();
sessionStorage.setItem("key", "value");
var value = sessionStorage.getItem("key");
sessionStorage.removeItem("key");
5.关于http
5.1 状态码
200 OK - [GET]：服务器成功返回用户请求的数据，该操做是幂等的（Idempotent）
201 CREATED - [POST/PUT/PATCH]：用户新建或修改数据成功
202 Accepted - [*]：表示一个请求已经进入后台排队（异步任务）
204 NO CONTENT - [DELETE]：用户删除数据成功。
301,302,303 redirect:重定向;
301永久性重定向 增长SEO排名，说说
302临时重定向,
303：对于POST请求，它表示请求已经被处理，客户端能够接着使用GET方法去请求Location里的URI。
307：对于POST请求，表示请求尚未被处理，客户端应该向Location里的URI从新发起POST请求。
304not modified：未修改返回缓存的内容再也不请求新的;request If-None-Match
400：客户端的URL输入有问题，浏览器解析不出来
401：须要身份验证
403：已经验证身份经过，可是服务器不予执行
404：对客户端请求服务端找不到资源
406 Not Acceptable - [GET]：用户请求的格式不可得（好比用户请求JSON格式，可是只有XML格式）
410 Gone -[GET]：用户请求的资源被永久删除，且不会再获得的
422 Unprocesable entity - [POST/PUT/PATCH] 当建立一个对象时，发生一个验证错误
503：服务器暂时没法提供服务，过一会就行了
5.2 GET和POST的区别？
GET - 从指定的资源请求数据
POST - 向指定的资源提交要被处理的数据
大小限制
get 1024字节 post 无限制，但能够自行设定
安全性
post较get安全
数据存放
get传输的参数附在URL后面 post传输的数据放在HTTP请求体中
幂等
get是幂等的，post不是
缓存，收藏，历史
get均可以，post没有
6.关于网络安全
xss(cross site script)跨站脚本攻击：
Reflected XSS（基于反射的XSS攻击）：搜索框内键入恶意代码
Stored XSS（基于存储的XSS攻击）：发布的帖子/文章键入恶意代码
DOM-based or local XSS（基于DOM或本地的XSS攻击）：免费WIFI中间网关对网页修改嵌入恶意代码
防范：前端对要显示的内容和服务端返回的内容进行转码htmlencode
服务端对请求的内容进行验证防范攻击
xss攻击主要是拿到cookie，因此能够禁止操做cookie,设置HttpOnly属性
详细见 https://segmentfault.com/a/1190000008423064
CSRF跨站请求伪造 cross site request forgery
详情：https://segmentfault.com/a/1190000008424201
冒充用户发起请求（在用户不知情的状况下）,完成一些违背用户意愿的请求
（好比散布的小广告点进去就完成转正操做了假如你刚刚登陆过网上银行session依旧未过时）
防护方法：
验证HTTP请求头部的referer便可知道是不是bank.com发起的请求;
请求地址中添加token并验证;
HTTP头部添加自定义属性并验证;
验证码
- XSS：
攻击者发现XSS漏洞——构造代码——发送给受害人——受害人打开——攻击者获取受害人的cookie——完成攻击
- CSRF：
攻击者发现CSRF漏洞——构造代码——发送给受害人——受害人打开——受害人执行代码——完成攻击
SQL注入攻击 构造巧妙的SQL语句，从而成功获取想要的数据；黑客的填空游戏
-
某个网站的登陆验证的SQL查询代码为：
strSQL = "SELECT * FROM users WHERE (name = '" + userName + "') and (pw = '"+ passWord +"');"
- 恶意填入
userName = "1' OR '1'='1";
- 与
passWord = "1' OR '1'='1";
- 时，将致使本来的SQL字符串被填为
strSQL = "SELECT * FROM users WHERE (name = '1' OR '1'='1') and (pw = '1' OR '1'='1');"
- 也就是实际上运行的SQL命令会变成下面这样的
strSQL = "SELECT * FROM users;"
防护方法 ： 对输入进行验证 整形参数判断 unicode转换等
7.关于跨域
同源策略
1 协议相同
2 域名相同
3 端口相同
跨域的方法
1.window.postMessage(message,targetOrigin) （双向跨域）
2.document.domain = 共同的主域名 跨子域 （双向跨域）
http://www.a.com/a.js http://script.a.com/b.js 统一为主域名a.com
----------------------------------------------------------
3.jsonp（单向跨域）
只支持get请求
<script src=".../callback()"></script>
4.CORS跨域资源共享 （单向跨域）
比JSONP强大，支持各类类型的HTTP请求 容许浏览器向跨源服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制 A跨域访问B，须要在B的响应头加入 Access-Control-Allow-Origin：http://A
5.服务器代理 （单向跨域）
跨域的HTTP请求是在服务器端
6.window.name （单向跨域）
8.关于构建工具gulp git grunt fis3
gulpjs是一个前端构建工具，与gruntjs相比：
gulpjs无需写一大堆繁杂的配置参数，
并且gulpjs使用的是nodejs中stream来读取和操做数据，其速度更快
npm install -g gulp 全局安装到本机c盘data中 npm install gulp 安装到本项目的node moudule模块中 npm install --save-dev gulp 将gulp依赖添加到本项目的packge.json的依赖内
就能够运行gulp命令执行gulpfile.js文件内定义的default任务了
gulpfile.js内
经常使用的四个API：gulp.task(), gulp.src(), gulp.dest(),gulp.watch()
gulp.src
gulp.src(globs) 获取文件流对象，是虚拟文件对象流，进而调用stream.pipe()继续操做流
经过指定gulp.src()方法配置参数中的base属性，咱们能够更灵活的来改变gulp.dest()生成的文件路径。
当咱们没有在gulp.src()方法中配置base属性时，base的默认值为通配符开始出现以前那部分路径。
例子：
gulp.src(script/lib/*.js, {base:'script'}) //配置了base参数，此时base路径为script
//假设匹配到的文件为script/lib/jquery.js
.pipe(gulp.dest('build')) //此时生成的文件路径为 build/lib/jquery.js
gulp.dest
gulp.dest(path) 用来写文件，path替换掉基本路径就是生成的文件的路径
gulp.task
gulp.task(name,[deps],fn) 任务的名字，依赖的任务，执行的方法
deps只有一个也要用数组括起来
若是任务A依赖B，B有异步编码，A不会等B的异步代码执行完而是直接执行，解决办法：
1，执行一个回调函数通知gulp异步完成
2，返回一个流对象
3，require Q;返回promise对象
gulp.watch
gulp.watch(glob,tasks) 匹配文件路径 文件改变后执行tasks(以前定义好的task,gulp.task(name,[deps],fn))
详情见 https://segmentfault.com/a/1190000008427866
对于GIT的提问
git rebase
git merge
等等 详情见 https://segmentfault.com/a/11...
9.关于框架vue angularjs
v-for ng-repeat
new vue({el:data:methods:})
angular.module(name,[]) 继而controller
angular controller之间通讯方式：
上下级之间通讯：做用域继承、事件触发（$on、$emit 和 $boardcast）
同级之间通讯：注入服务 service、借助父级controller实现子级controller之间的通讯、借助$rootScope实现同级之间的通讯
10.关于nodejs
建立简单的服务器
var http = require("http");
http.createServer(function(request, response) {
response.writeHead(200, {"Content-Type": "text/plain"});
response.write("Hello World");
response.end();
}).listen(8888);
11.关于restfulAPI
1.协议
HTTPS协议
2.域名
能够添加次级域名 https://api.example.com 若是不须要扩展，能够放在主域名下 https://example.com/api
3.版本
为API添加版本 https://api.example.com/v1/
4.不容许动词
路径名词通常与数据库表格一直 https://api.example.com/v1/animals
5.参数设计
参数键值形式 & 符号分开 https://api.example.com/v1/animals?name='cat'&sex='1'
6.错误处理
请求结果是错误的4xx
通常返回的JSON数据中设置erro键
{
error: "Invalid API key"
}
7.HTTP动词
经常使用的：GET,POST GET（SELECT）：从服务器取出资源（一项或多项） POST（CREATE）：在服务器新建一个资源 另有： PUT（UPDATE）：在服务器更新资源（客户端提供改变后的完整资源） PATCH（UPDATE）：在服务器更新资源（客户端提供改变的属性） DELETE（DELETE）：从服务器删除资源 HEAD：获取资源的元数据 OPTIONS：获取信息，关于资源的哪些属性是客户端能够改变的
8.状态码
上翻有
12.关于异步编程
ES 6之前：
-
回调函数（ajax实现异步的原理就是采用了回调函数）
function f1(callback){ setTimeout(function () { // f1的任务代码 callback(); }, 1000); } f1(f2);问题：多层嵌套很混乱，异常难以捕获
-
事件驱动/事件监听 发布/订阅模式(观察者模式)
原理同 回调
-
promise对象
promise模式在任什么时候刻都处于如下三种状态之一： 未完成（unfulfilled）、已完成（resolved）和拒绝（rejected） promise对象上的then方法负责添加针对已完成和拒绝状态下的处理函数。 then(resolvedHandler, rejectedHandler); then方法会返回另外一个promise对象，以便于造成promise管道， 这种返回promise对象的方式可以支持开发人员把异步操做串联起来
ES 6：
* Generator函数(协程coroutine)
ES 7:
* async和await
13.关于模块化编程 requirejs seajs commonjs
AMD（Require遵循的规范）define, require
CMD（SeaJS遵循的规范）常用的 API 只有 define, require, require.async, exports, module.exports 这五个
-
promise（commonJS提出的规范）
1.对于依赖的模块，AMD 是提早执行，CMD 是延迟执行。 不过 RequireJS 从 2.0 开始，也改为能够延迟执行（根据写法不一样，处理方式不一样） 2.CMD 推崇依赖就近，AMD 推崇依赖前置。
14.关于面向对象
14.1封装性
JS没有类，怎么谈封装呢。有对象，对象有属性
有构造函数，构造函数有基本属性值和引用属性值
函数有prototype原型，能够实现属性方法共享
14.2多态性
14.3继承性
某一对象的实例 赋值给 另外一个对象的原型 实现继承
构造函数、实例、原型的关系：
var a = function(){...};
var b = new a();//b 是由 a 构造出来的
var c = function(){...};
c.prototype = b;//c 继承了 a
15.关于跨设备响应式
1.百分比
2.移动端禁viewport缩放功能
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
width：viewport 的宽度，能够指定一个固定值，如650；或者能够是device-width，表示设备的宽度 height：和 width 相对应，可指定高度 initial-scale：页面初始缩放比例(0-1) maximum-scale：容许用户缩放到的最大比例(0-1) minimum-scale：容许用户缩放到的最小比例(0-1) user-scalable：用户是否能够手动缩放（yes/no）
禁用chrome 自调节字体大小
body {
-webkit-text-size-adjust: 100%;
}
3.CSS3 media queries
@media only screen and (max/min-width/height: 960px) {
/* 样式定义 */
}
@media only screen and (max-width:500px){
.outDiv {
margin: 0 auto;
}
}
16.关于浏览器兼容
简单总结
css 样式加前缀 -webkit这样子的 js 冒泡事件和阻止冒泡
不少见：http://blog.csdn.net/xingxing...
http://blog.csdn.net/comeonj/...
17.关于linux
暂且放两个连接 以前写过的：
https://segmentfault.com/a/11...
https://segmentfault.com/n/13...
18. 前端性能优化
- HTTP:减小HTTP请求；解决办法：合并图片，合并css,js文件，lazzyload懒加载图片
- CSS：合理用reflow,repaint:style变一次就reflow一次，所以尽量设一个新的class，改变className，reflow一次
- DOM:减小DOM操做，多用innerHTML一次添加
- JSON格式交换数据，轻量级数据
- css放在头部，js放在尾部，外部引用
6.CDN内容分发网络，实时性不太好
相关文章
- 1. 前端面试知识点总结
- 2. 前端面试总结(1)--笔试知识点汇总
- 3. 2019前端面试知识点汇总
- 4. 前端面经知识点总结1
- 5. 前端知识点总结
- 6. 前端知识点 总结
- 7. 前端笔试知识点总结（4）
- 8. 前端笔试知识点总结(5)
- 9. 前端面试知识点
- 10. 前端面试知识总结1
- 更多相关文章...
- • 与传输层有关的基本知识 - TCP/IP教程
- • Lua 调试(Debug) - Lua 教程
- • 使用阿里云OSS+CDN部署前端页面与加速静态资源
- • 算法总结-双指针
相关标签/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
欢迎关注本站公众号,获取更多信息
相关文章
- 1. 前端面试知识点总结
- 2. 前端面试总结(1)--笔试知识点汇总
- 3. 2019前端面试知识点汇总
- 4. 前端面经知识点总结1
- 5. 前端知识点总结
- 6. 前端知识点 总结
- 7. 前端笔试知识点总结（4）
- 8. 前端笔试知识点总结(5)
- 9. 前端面试知识点
- 10. 前端面试知识总结1