web前端面试知识点总结

(1)button是行内元素还是块级元素?
答:它是可变元素,既不属于行内元素,也不属于块级元素。可变元素:根据上下文语境决定该元素为块级还是内联(可变元素如:button、iframe、map等)。

(2)行内元素有哪些?块级元素有哪些?css盒子模型是什么?
答:
块级元素:div , p , form, ul, li , ol, dl, form, address, fieldset, hr, menu, table。
行内元素:span, strong, em, br, img , input, label, select, textarea, cite。
盒子模型:其本质就是一个盒子,外面包围着HTML元素,它包括:边距,边框,填充,内容等,允许我们在元素之间放置其他元素。

(3)一个完整的HTTP事物是一个怎样的过程?
答:

  1. 域名解析
  2. 发起TCP的3次握手
  3. 建立TCP连接后发起http请求
  4. 服务器端响应http请求,浏览器得到html代码 5. 浏览器解析html代码,并请求html代码中的资源
  5. 浏览器对页面进行渲染呈现给用户

(4)常见的浏览器内核都是那些?
答:IE:trident内核 Firefox:gecko内核 Safari:webkit内核 Opera:以前是presto内核,Opera现已改用Google Chrome的Blink内核 Chrome:Blink(基于webkit,Google与Opera Software共同开发)

(5)link和@import有什么区别:
答:
相同点:两者都是外部引用CSS的方式。
不同点:
1:link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;@import属于CSS范畴,只能加载CSS。
2:link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。
3:link是XHTML标签,无兼容问题;@import是在CSS2.1提出的,低版本的浏览器不支持。
4:ink支持使用Javascript控制DOM去改变样式;而@import不支持。

(6)DOM和@BOM有什么区别:
答:DOM文档对象类型,用来获取或设置文档中标签的属性,例如获取或者设置input表单的value值。BOM浏览器对象模型,用来获取或设置浏览器的属性、行为,例如:新建窗口、获取屏幕分辨率、浏览器版本号等。
BOM的内容不多,主要还是DOM。 由于DOM的操作对象是文档(Document),所以dom和浏览器没有直接关系。

(6)请写出jQuery绑定事件的方法:
答:jQuery中提供了四种事件监听方法,分别是bind、live、delegate、on,对应的解除监听的函数分别是unbind、die、undelegate、off。

(7)js 字符串操作函数

concat() – 将两个或多个字符的文本组合起来,返回一个新的字符串。

indexOf() – 返回字符串中一个子串第一处出现的索引。如果没有匹配项,返回 -1 。

charAt() – 返回指定位置的字符。

lastIndexOf() – 返回字符串中一个子串最后一处出现的索引,如果没有匹配项,返回 -1 。

match() – 检查一个字符串是否匹配一个正则表达式。

substr() 函数 – 返回从string的startPos位置,长度为length的字符串

substring() – 返回字符串的一个子串。传入参数是起始位置和结束位置。

slice() – 提取字符串的一部分,并返回一个新字符串。

replace() – 用来查找匹配一个正则表达式的字符串,然后使用新字符串代替匹配的字符串。

search() – 执行一个正则表达式匹配查找。如果查找成功,返回字符串中匹配的索引值。否则返回 -1 。

split() – 通过将字符串划分成子串,将一个字符串做成一个字符串数组。

length – 返回字符串的长度,所谓字符串的长度是指其包含的字符的个数。

toLowerCase() – 将整个字符串转成小写字母。

toUpperCase() – 将整个字符串转成大写字母。

(8)怎样添加、移除、移动、复制、创建和查找节点?

1、创建新节点
  createDocumentFragment() //创建一个DOM片段
  createElement() //创建一个具体的元素
  createTextNode() //创建一个文本节点

2、添加、移除、替换、插入
  appendChild() //添加
  removeChild() //移除
  replaceChild() //替换
  insertBefore() //插入

3、查找
  getElementsByTagName() //通过标签名称
  getElementsByName() //通过元素的Name属性的值
  getElementById() //通过元素Id,唯一性

(9)比较typeof与instanceof?
相同点:JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空,或者是什么类型的。

typeof的定义和用法:返回值是一个字符串,用来说明变量的数据类型。

细节:

1、typeof 一般只能返回如下几个结果:number,boolean,string,function,object,undefined。

2、typeof 来获取一个变量是否存在,如 if(typeof a!=“undefined”){alert(“ok”)},而不要去使用 if(a) 因为如果 a 不存在(未声明)则会出错。

3、对于 Array,Null 等特殊对象使用 typeof 一律返回 object,这正是 typeof 的局限性。

Instanceof定义和用法:instanceof 用于判断一个变量是否属于某个对象的实例。

实例演示:

a instanceof b?alert(“true”):alert(“false”); //a是b的实例?真:假

(10) 如何理解闭包?

1、定义和用法:当一个函数的返回值是另外一个函数,而返回的那个函数如果调用了其父函数内部的其它变量,如果返回的这个函数在外部被执行,就产生了闭包。

2、表现形式:使函数外部能够调用函数内部定义的变量。

3、实例如下:
(1)、根据作用域链的规则,底层作用域没有声明的变量,会向上一级找,找到就返回,没找到就一直找,直到window的变量,没有就返回undefined。这里明显count 是函数内部的flag2 的那个count 。

var count=10;   //全局作用域 标记为flag1
function add(){
    var count=0;    //函数全局作用域 标记为flag2
    return function(){
        count+=1;   //函数的内部作用域
        alert(count);
    }
}
var s = add()
s();//输出1
s();//输出2

4、变量的作用域
要理解闭包,首先必须理解Javascript特殊的变量作用域。

变量的作用域分类:全局变量和局部变量。

特点:
函数内部可以读取函数外部的全局变量;在函数外部无法读取函数内的局部变量。
函数内部声明变量的时候,一定要使用var命令。如果不用的话,你实际上声明了一个全局变量!

5、使用闭包的注意点
滥用闭包,会造成内存泄漏:由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。
会改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method),把内部变量当作它的私有属性(private value),这时一定要小心,不要随便改变父函数内部变量的值。

猜你喜欢

转载自blog.csdn.net/qq_23350817/article/details/83782409