面试题(简答)--题目

1. 描述网页从打开到显示的过程

解析:前端原理问题。

网页加载流程
  1. 解析 HTML 文档生成DOM树,解析CSS文件生成CSS规则树(CSSOM)。
  2. 结合CSS规则树和DOM树生成渲染树(Render Tree)。
  3. 渲染树布局,为每个节点分配一个在屏幕上的确切坐标。
  4. 渲染树绘制,显示每个节点。

详细可参见浏览器的工作原理:新式网络浏览器幕后揭秘

2. 怎么绑定事件

  1. 在DOM元素中直接绑定。
onXXX="JavaScript Code"
  • onXXX为事件名称
  • JavaScript Code 为处理事件的JavaScript代码,一般是函数。
  1. 在JavaScript代码中绑定。
elementObject.onXXX=function(){
    // 事件处理代码
}
  • elementObject为DOM对象,即DOM元素。
  • onXXX为事件名称。
  1. 绑定事件监听函数。
    W3C标准写法
elementObject.addEventListener(eventName,handle,useCapture);

IE6~IE8写法

elementObject.attachEvent(eventName,handle);
  • elementObject是DOM对象
  • eventName事件名,attachEvent事件名带on;addEventListener事件名不带on.
  • handle事件监听函数
  • useCapture 默认为false。通常不用加。

3. 怎么获取随机数

Math.random()

4. 创建对象有几种方法

解析:JS高级问题

一共有6种创建对象方式:

  1. 基础模式
  2. 工厂模式
  3. 构造函数模式
  4. 原型模式
  5. 组合模式
  6. 动态原型模式

5. 根据id获取元素的原生方法

document.getElementById("元素ID");

6. 怎么判断一个变量的类型

typeof 变量名

7. form标签的特有属性有哪些

  • 原有属性

|属性名|属性值|说明|
|:-:|
|name|标识符|定义表单名称|
|action|url|提交表单服务器地址|
|method|get post|表单提交方式|
|target|_blank _self|打开actionURL方式|
|enctype|application/x-www-form-urlencoded text/plain multipart/form-data |表单数据编码方式|

  • H5新增属性

|属性名|属性值|说明|
|:-:|
|novalidate|novalidate|不执行表单自带验证|
|autocomplete|on off|表单自动完成|

8. 写一个判断正整数的正则表达式

解析:简单问题

^\d+$

9. post与get的区别

解析:重要的基础问题

  1. GET参数通过URL传递,POST放在Request body中,GET比POST更不安全,因为参数直接暴露在URL上,所以不能用来传递敏感信息。
  2. GET请求在URL中传送的参数是有长度限制的(一般是2KB),而POST没有限制。

解析:下面是一些补充性答案,加分项。

  1. GET在浏览器回退时是无害的,而POST会再次提交请求。
  2. GET产生的URL地址可以被浏览器设置页签,而POST不可以。
  3. GET请求会被浏览器主动cache,而POST不会,除非手动设置。
  4. GET请求只能进行url编码,而POST支持多种编码方式。
  5. GET请求参数会被完整保留在浏览器历史记录里,而POST中的参数不会被保留。

10. eval怎么使用

解析:在实际使用中,用eval的情况并不多。

把JS代码字符串作为eval的参数调用,如果有结果的话,返回结果。
例如:var res = eval("1+2*3");

解析:如果更详细说明,加上下面的处理。
如果参数不是正确的JS字符串,会抛出异常,需要使用try-catch包裹。

try {
     var res =  eval("1+2*3");
} catch(exception)  {
     alert(exception);
}

11. 水平垂直居中的css

center-middle {
  margin:auto;
  position:absolute;
  top:0;
  bottom:0;
  right:0;
  left:0;
}

推荐阅读更多精彩内容