前端常见面试题（十四）

目录：

1，什么是事件委托？为什么要用事件委托？

2，你如何优化自己的代码？

3，什么是盒模型？

4，行内、块元素、空元素分别举例

5，src和href的区别

一：什么是事件委托？为什么要用事件委托？

事件委托，又称事件代理，就是将元素的事件处理交由父元素或者祖先元素来代为执行；

事件委托利用了事件冒泡，只指定一个事件处理程序（函数），就可以管理某一类型的所有事件。

例如：我们只需要在document上绑定一个onclick事件，就可以通过事件冒泡的特性来处理一整个页面上所有的onclick事件，而不必给每一个元素去绑定onclick事件；当然这只是举个栗子，我们正常情况下绝对不会这么去做的。

为什么要用事件委托？why

在javascript进行事件处理的时候，每个添加到页面上的事件函数都将直接影响页面的整体性能，每一个函数都是一个对象，都会占用内存，而内存中的对象越多，性能就越差。而为了解决这种问题，我们就需要使用事件委托。

事件委托的优点

1，只在内存中开辟了一块空间，节省资源同时减少了dom操作，提升整体性能；

,2，在页面中设置事件处理程序的时间大大减少了；

3，对于新添加的元素也会有之前的事件；

,4，不需要对事件委托的元素手动移除事件处理程序。

二：你如何优化自己的代码？

命名规范；

注释覆盖率50%以上；

避免全局变量；

避免修改原生API；

拆分函数，避免函数过于臃肿；

函数专注于做一件事情；

模块化封装；

组件化开发；

对于常量始终保持先定义后使用；

对于两个分支的判断，使用三目运算符，对于多个分支的判断使用switch语句；

减少DOM操作，减少页面重绘；

尽可能使用 === 而不是 ==，避免隐式转换。

四：src和href的区别

1，.使用src属性的元素，例如img、iframe、script，如果src路径出现问题的话，页面的内容会受到影响，用户没有办法看到页面本来应该显示的内容和使用页面应该实现的功能。

2，使用href属性的元素，例如link、a,如果href路径出现问题的话，页面不会有很大的影响，对于样式文件来说，只是影响页面的美观度，而不会影响页面的正常浏览和使用，对于超链接来说，只是页面无法与其它页面建立链接，对当前页面的影响也不大。

src表示引用资源，是页面不可少的一部分，它会替换掉当前的元素，而href是关联，是将当前页面与指定资源建立链接。