目录
2.描述cookies,sessionStorage和localStorage的区别?
3.行内元素有哪些?块级元素有哪些? 空(void)元素有那些?
7.常见的浏览器的的兼容问题?你使用过哪些浏览器调试你的项目?它们的内核分别是?
1.什么是盒子模型?盒子模型分为哪几种?如何计算?
- css中所有的html元素都可以看成为一个盒子,一个盒子模型包括 margin border padding content
- 盒子模型分为两大类:
- W3C盒子模型和IE盒子模型。(编写代码时应该尽量使用标准的W3C盒子模型 可在页面中声明DOCTYPE 标准模式)
- W3C盒子计算 :margin+border+padding+width
- IE盒子计算:margin+width
2.描述cookies,sessionStorage和localStorage的区别
1.数据的存储大小限制不同。
- cookies:数据始终在同源的https请求中携带,即cookies能在服务器和浏览器间回传。故存储的数据大小最小,一般为4096B.
- sessionStorage:数据保存在本地,不会自动发给 服务器。一般为5M或者更大
- localStorage:数据保存在本地,不会自动发给服务器。一般为5M或者更大
2.数据的有效期不同。
- cookies:数据在cookies设置的有效期之前都有效,即使窗口和浏览器关闭。
- sessionStorage:数据在关闭浏览器窗口后自动清除。存储的数据仅在同源窗口内有效,即使在不同浏览器相同的页面也是无效的,一般用于会话数据的存储
- localStorage:始终有效,因此用作持久数据
3.数据的作用域不同。
- cookies,localStorage:在所有同源 窗口敏感共享
- sessionStorage:不再不同浏览器窗口共享
同源窗口共享是2113连接PC与移动设备的软件,使用同源窗口共享,可以在PC与移动设备间轻松共1653享屏幕内容与数据。
3.行内元素有哪些?块级元素有哪些? 空(void)元素有那些?
- 行内元素有:a、b、span、img、input、strong、select、label、em、button、textarea等;
- 块级元素有:div、ul、li、dl、dt、dd、p、h1-h6、blockquote等;
- 空元素(没有内容的html元素)有:br、meta、hr、link、input、img。
4.'data-属性'的作用是什么?
- data-属性为html5推出的一个新功能,前端开发者可以利用其设置需要的自定义属性,来进行一些数据的存放。当然,在高级浏览器下可通过JS脚本进行定义和数据的存取。
5.iframe有什么作用?优缺点?
iframe被称作嵌入式框架,用于设置文本或图形的浮动图文框或容器;
优点有:
①.iframe能够原封不动的把嵌入的网页展现出来。
②.如果有多个网页引用iframe,那么只需要修改iframe的内容,就可以实现调用的每一个页面内容的更改,方便快捷。
③.网页如果为了统一风格,头部和版本都是一样的,就可以写成一个页面,用iframe来嵌套,可以增加代码的可重用性。
④.可以解决第三方内容如图标和广告加载缓慢的问题。
⑤.重载页面时不需要重载整个页面,只需要重载页面中的一个框架页,减少了数据的传输,增加了网页下载速度
缺点有:
①.页面样式调试麻烦,会出现多个滚动条,并产生多个页面,不容易打印;
②.浏览器的后退按钮不可用;
③.若有过多iframe标签会增加服务器的HTTP的请求;
④.小型的移动设备无法完全显示框架,即设备兼容性差;
⑤.代码复杂,某些搜索引擎无法解读。
6.你如何对网站的文件和资源进行优化?
- 文件合并、文件压缩、使用cdn(内容分发网络)托管您的资源、使用缓存、优化meta标签、启用Gzip压缩css/js文件
- 将css/js文件放在外部文件中,避免写在同一页面中,引用时将css放在最上面,js放在最下面等
7.常见的浏览器的的兼容问题?你使用过哪些浏览器调试你的项目?它们的内核分别是?
①不同浏览器的标签默认的外补丁( margin )和内补丁(padding)不同;
②图片之间默认有间距;
③边距重叠问题;当相邻两个元素都设置了margin 边距时,margin 将取最大值,舍弃最小值;
④两个块级元素,父元素设置了overflow:auto;子元素设置了position:relative ;且高度大于父元素,在IE6、IE7会被隐藏而不是溢出;
⑤IE9以下版本浏览器不能使用opacity;
⑥当标签的高度设置小于10px,在IE6、IE7中会超出自己设置的高度;
⑦IE6双边距问题;在 IE6中设置了float , 同时又设置margin , 就会出现边距问题。
用过Google Chrome、QQ浏览器以及Firefox浏览器,它们的内核分别是Webkit、webkit和IE的核以及Gecko内核
8.avaScript数据类型:
值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。
引用数据类型:对象(Object)、数组(Array)、函数(Function)。
9.js中var 和 let 和 const的区别
- var 声明的变量属于函数作用域,let和const声明的变量属于块级作用域;
- var存在变量提升现象,而let和const没有;
- var变量可以重复声明,而在同一块级作用域,let变量不能重新声明,const变量不能修改。
10.清除浮动有哪些方式?
1.父级div定义overflow:hidden
2.结尾处加空div标签clear:both
3.父级div定义height
4.父级div定义overf:auto
5.用伪元素,父级div定义伪类:after(必须设置content)