第四篇

1.说说前端中的事件流？

HTML中与javascript交互式通过事件驱动来实现的，例如鼠标点击事件，onclick，页面的滚动事件onscroll等等，可以向文档或者文档中的元素添加事件侦听器来预订事件。想要知道这些事件是在什么时候进行调用的，就需要了解一下“事件流”的概念

什么是事件流：事件流描述的是从页面中接收事件的顺序，DOM2级事件流包括下面几个阶段。

事件捕获阶段

处于目标阶段

事件冒泡阶段

addEventListener：addEventListener是DOM2级事件新增的指定事件处理程序的操作，这个方法接收3个参数：

要处理的事件名，作为事件处理程序的函数和一个布尔值（默认为false，即冒泡的方式）。最后这个布尔值参数如果是true，表示在捕获阶段调用事件处理程序；

如果是false，表示在冒泡阶段调用事件处理程序。

向dom绑定事件的三种方式

1）行内绑定

<button onclick="clickhander()">按钮</button>

2）js内绑定（DOM0）

btnDom.onclick = function clickHandler() {
       console.log('click');            
}

3）事件监听器绑定（DOM2）默认是为false=》冒泡。

btn.addEventListener('click', e => {
　　console.log('click')
})

　

2.如何让事件先冒泡后捕获？

　　在DOM标准事件模型中，是先捕获后冒泡。但是如果要实现先冒泡后捕获的效果，对于同一个事件，监听捕获和冒泡，

分别对应相应的处理函数，监听到捕获事件，先暂缓执行，直到冒泡事件被捕获后再执行捕获事件。

 

3.mouseover和mouseenter的区别？

　　mouseover：当鼠标移入元素或其子元素都会触发事件，所以有一个重复触发，冒泡的过程。对应的移除事件是mouseout.

　　mouseenter：当鼠标移除元素本身（不包含元素的子元素）会触发事件，也就是不会冒泡，对应的移除是mouseleave。

4.js的new操作符做了哪些事情？

　　new操作符新建了一个空对象，这个对象原型指向构造函数的prototype，执行构造函数后返回这个对象。

5.js的各种位置，比如clientHeight，scrollHeight，以及scrollTop，offsetTop，clientTop的区别

　　1）clientHeight：表示的是可视区域的高度，不包含border和滚动条

　　2）offsetHeight：表示可视区域的高度，包含了border和滚动条

　　3）scrollHeight：表示了所有区域的高度，包含了因为滚动被隐藏的部分。

　　4）clientTop：表示边框border的厚度，在未指定的情况下一般为0。

　　5）scrollTop：滚动后被隐藏的高度，获取对象想对于由offsetParent属性指定的父坐标（css定位的元素

或body元素）距离顶端的高度。

6.Iframe是什么？有什么缺点？

　　定义：iframe元素会创建包含另一个文档的内联框架

　　提示：可以将提示文字放在<iframe></iframe>之间，来提示某些不支持iframe的浏览器

　　缺点：

　　　　会阻塞主页面的onload事件

　　　　搜索引擎无法解读这种页面，不利于SEO

　　　　iframe和主页面共享连接池，而浏览器对相同区域有限制所以会影响性能。

7.Doctype作用？严格模式和混杂模式如何区分？他们又何意义？

　　Doctype声明于文档最前面，告诉浏览器以何总方式来渲染页面，这里有两种模式，严格模式和混杂模式。

　　严格模式的排版和JS运作模式是以该浏览器支持的最高标准运行。

　　混杂模式，向后兼容，模拟老式浏览器，防止浏览器兼容页面。

8.link标签和import标签的区别？

　　link属于html标签，而@import是css提供的

　　页面被加载时，link会同时被加载，而@import引用的css会等到页面加载结束后加载。

　　link是html标签，因此没有兼容性，而@import只有IE5以上才能识别。

　　link方式样式的权重高于@import。

9.多行元素的文本省略号？

10.简述一下src和href的区别？

1）href是指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的链接，用于超链接。

2）src是指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置；在请求src资源时将其

　　指向的资源下载并应用到文档内，例如js脚本，img图片和frame等元素。

3）当浏览器解析到元素时，会暂停其他资源的下载和处理，直到将该资源加载、编译、执行完毕，

　　图片和框架等元素也如此，类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。

   转载：http://www.itlike.com/article/23