关于2019年web前端开发面试题基础知识点总结

来源:07素材网 03月16日 20:45

1.水平垂直居中

子绝父相,子盒子设置绝对定位,设置top:50%;left:50%,margin-top:-50%;margin-left:-50%;
子绝父相,子盒子设置绝对定位,设置 left & top & right & bottom为0;margin: auto;
伸缩盒子,父元素设置flex;justify-content: center;align-items: center;
利用transform属性,需要设置子绝父相,设置top:50%;left:50%;transform:translate(-50%, -50%);

2.圣杯布局

中间盒子设置宽度100%,左右margin,留出左右盒子的位置
左右盒子在通过定位至左右

3.兼容性问题

标签样式在不同的浏览器各自的margin 和padding差异较大, 解决方案:css里 *{margin:0;padding:0;}
当在a标签中嵌套img标签时,在某些浏览器中img会有蓝色边框;解决方案:给img添加border:0;或者是border:none;
图片默认有间;隙解决方案:1)给img标签添加左浮动float:left;2)给img标签添加display:block。

4.清除浮动的方法?(重点)

1.父级div定义height
2.结尾处家空div标签clear:both
3.父级div定义 伪类:after和zoom
4.父级div定义 overflow:hidden

5.前端优化技巧

压缩css,js,图片
2.减少http请求次数,合并css,js 合并图片(雪碧图)
3.使用CDN
4.减少dom元素数量
5.图片懒加载
6.静态资源另外用无cookie得域名
7.减少dom的访问(缓存dom)
8.巧用事件委托
9.样式表置顶,脚本置低

6.this指向问题

一般来说,谁调用,this就指向谁,特殊情况除外
普通函数调用,此时 this 指向 window
定时器函数, 此时 this 指向 window
更改this指向的三个方法
1.call( )方法调用一个函数,其具有一个指定的this值

fn.call(改变其this指向, [指定的参数] ) 如果指定了null或者undefired,则内部this指向window

应用场景:①借用构造函数

②借用其他对象的方法

2.apply( )方法调用一个函数,其具有一个指定的this值,作为一个数组提供的参数

fn.apply(var1, var2) 应用:把数组展开

应用场景:把数组展开,传递给调用的方法

3.bind 不会调用函数,会返回一个新的函数

应用场景:①改变定时器内部的this,②改变事件处理函数的this

7、json字符串转化方法

JSON.parse(str); //由JSON字符串转换为JSON对象
JSON.stringify(obj); //将JSON对象转化为JSON字符
原文出处:https://www.cnblogs.com/jun-qi/p/10543210.html
版权声明:本文来源地址若非本站均为转载,若侵害到您的权利,请及时联系我们,我们会在第一时间进行处理。

头条

在使用SQLite3时遇到的几个坑

在使用SQLite3时遇到的几个坑

《本打算在SQLite3数据库里执行一个查询语句,使用的是php语言,起初遇到的是权限问题: permission denied,因为SQLite3数据库文件和PHP执行者属于两个不同的用户,首先需要对这个文件执行mode 777的权限开放,然后,又遇到了下面这样的PHP错误