前端经典面试题1

目录：

1.什么是盒子模型？

2.简述一下src与href的区别?

3.简述同步和异步的区别?

4.怎样添加、移除、移动、复制、创建和查找节点？

 

1.什么是盒子模型？

   在网页中，一个元素占有空间的大小由几个部分构成，其中包括content，padding，border和margin，即元素的内容、内边距、边框、外边距，这四者就构成了一个“盒子”。4个部分一起构成了css中元素的盒模型。

    如上图，真正的内容就是这些文字，文字外围有10px的内边距，5px的border，10px的外边距。

    在盒子模型中，我们设置的宽度都是内容宽度，不是整个盒子的宽度。而整个盒子的宽度是：（内容宽度 + border宽度 + padding宽度 +margin宽度）之和。这样我们改四个中的其中一个，都会导致盒子宽度的改变。

    如何解决这一问题？答案就是：box-sizing:border-box。此时整个盒子的宽度是：内容 + padding+边框的宽度（不包括margin），这样就比较符合我们的实际要求了。

    参考自王福朋博客 <http://www.cnblogs.com/wangfupeng1988/p/4287292.html>

 

2.简述一下src与href的区别?

    简单说，src是引入文件，href是链接跳转。

    src 是指向物件的来源地址，是引入，在 img、script、iframe 等元素上使用。

    href 是超文本引用，指向需要连结的地方，是与该页面有关联的，是引用，在 link和a 等元素上使用。

    src仅仅嵌入当前资源到当前文档元素定义的位置，如<script src='app.js'></script>中，在浏览器下载、编译、执行这个文件之前，页面的加载和处理会被暂停；href则是指定网络资源的位置，用于在涉及的文档和外部资源之间建立关系，如<link rel="stylesheet" href="app.css" />，页面解析不会暂停。

3.简述同步和异步的区别?

   同步是阻塞模式，异步是非阻塞模式。
   同步就是指一个进程在执行某个请求的时候，若该请求需要一段时间才能返回信息，那么这个进程将会一直等待下去，直到收到返回信息才继续执行下去；
   异步是指进程不需要一直等下去，而是继续执行下面的操作，不管其他进程的状态。当有消息返回时系统会通知进程进行处理，这样可以提高执行的效率。

参考自1、<http://blog.csdn.net/qq_22855325/article/details/72958345>

          2、https://zhidao.baidu.com/question/1544707761850462667.html

             3、<https://zhuanlan.zhihu.com/p/27856106> 

4.怎样添加、移除、移动、复制、创建和查找节点？

1)创建新节点

createDocumentFragment()//创建一个DOM片段

createElement()//创建一个具体的元素

createTextNode()//创建一个文本节点

2)添加、移除、替换、插入

appendChild() //添加 用于向childNodes列表的末尾添加一个节点

removeChild()//移除

replaceChild()//替换

insertBefore()//插入

3)查找

getElementsByTagName()//通过标签名称

getElementsByName()//通过元素的Name属性的值

getElementById()//通过元素Id，唯一性

4)复制节点

cloneNode()方法，用于复制节点， 接受一个布尔值参数， true表示深复制（复制节点及其所有子节点）， false表示浅复制（复制节点本身，不复制子节点）

参考自 <http://blog.csdn.net/qi1271199790/article/details/53869508>