Web前端基础总结

1.Js的基本类型：Undefined:只有一个值undefined，它是变量未被赋值时的值，在JS中全局对象有一个undefined属性表示undefined，事实上undefined并非JavaScript的关键字，可以给全局的undefined属性赋值来改变它的值。Null:只有一个值null,但是JavaScript为它提供了一个关键字null来表示这个唯一的值。Null类型的语义是“一个空的对象引用”。Number:NaN是其一个特殊的属性值，typeofNaN//“number”);String:其正式解释是一个16位无符号整数类型的序列，它实际上用来表示以UTF-16编码的文本信息。Boolean:有两种取值true和false。0、NaN、空字符串、null、undefined转化为false，其余的全部为true。Object:最为复杂的类型就是Object，它是一系列属性的无序集合，Function是实现了私有属性[[call]]的Object，JavaScript的宿主也可以提供一些特别的对象。typeof['3','344']//‘Object’关于null和undefined：null是关键字；undefined不是关键字，undefined是Global对象的一个属性。运算时null与undefined都可以被类型转换为false，但不等值于false：document.writeln(!null,!undefined);//true,truedocument.writeln(null==false);//falsedocument.writeln(undefined==false);//falsedocument.writeln(undefined==null);//truenullinstanceofObject//falsetypeofnull//Object2.JS的类型转换手动的转换有：Number(x);Boolean(x);String(x);以及parseInt,parseFloat,toString,valueOf等等。自动的转换：如果“+”操作符的一个操作数是字符串，则会将另一个操作数转换为字符串，一元操作符“*”、“-”将操作数转换为数字，一元操作符“！”将操作数转换为布尔值并取反。‘hello’+5//‘hello5’‘hello’+null//‘hellonull’‘5’*5//25‘hello’*5//NaNX+””//等价于String(x)+X或者X-0//等价于Number(X)!!X//等价于Boolean(X)3.margin属性四个参数：上右下左三个参数：上、左右、下两个参数：上下、左右一个参数：四周4.关于float问题，浮动元素后跟非浮动元素的情况。后边非浮动元素若为行内元素且因为定位产生重叠时，行内元素边框、背景和内容都在该浮动元素“之上”显示，若为块级元素且因为定位产生重叠时，该块级元素边框和背景在该浮动元素“之下”显示，只有内容在浮动元素“之上”显示。【有示例】。Clear属性规定元素的哪一侧不允许其他浮动元素。clear属性定义了元素的哪边上不允许出现浮动元素。在CSS1和CSS2中，这是通过自动为清除元素（即设置了clear属性的元素）增加上外边距实现的。在CSS2.1中，会在元素上外边距之上增加清除空间，而外边距本身并不改变。不论哪一种改变，最终结果都一样，如果声明为左边或右边清除，会使元素的上外边框边界刚好在该边上浮动元素的下外边距边界之下。5.绝对定位、相对定位与浮动定位绝对定位：absolute生成绝对定位的元素，相对于static定位以外的第一个父元素进行定位。设置为绝对定位的元素框从文档流完全删除，并相对于其包含块定位，包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像该元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。相对定位：relative生成相对定位的元素，相对于其正常位置进行定位。设置为相对定位的元素框会偏移某个距离。元素仍然保持其未定位前的形状，它原本所占的空间仍保留。浮动定位：浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。示例代码就是最外层的div是relative，里面的就是absolute。6.关于DOM元素利用DOM，JS可以相对简单地寻找、访问和操纵HTML元素，从而动态地改变HTML页面的内容和外观。节点常用的属性有parentNode,childNodes,firstChild,lastChild,previousSibling,nextSibling。7.关于函数定义顺序：函数的定义与其他的语句的定义不再同一个时间轴上面，计算机在开始执行语句之前，会先查找所有的function的定义，然后保存。所以在函数后面定义的调用语句可以调用到定义在前面的函数。局部变量与全局变量：局部变量只适合于函数的参数和函数内部已var关键字定义的变量。如果没有定义同名的局部变量，函数内部则可能访问全局变量。闭包：首先要知道在js中，函数在一旦定义的时候就会产生自己的一个作用域，而此后这个函数的执行也是要依赖于这个作用域的。闭包的最常用的编程模式就是在一个函数中嵌套另一个函数，然后将这个嵌套的函数作为返回值返回，当然外部函数中的局部变量也就存在于这个返回函数的作用域中的，这样就起到了对局部变量的一个访问控制。但是缺点在于增大了内存的开支。而且其所派生的子类将不能访问其私有属性，破坏了继承性。因此还是需要三思而行。闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的保护函数内部的变量，另一个就是让在内存中维持变量。我写的闭包主要用于实现一些插件，因为有一些变量需要避免被全局变量污染。可选参数：Js不会限制传入函数的参数数目。如果传入的参数过多，多余的参数会被忽略掉。如果过少，缺失的参数会默认为undefined。apply和call的区别：相同点:两个方法产生的作用是完全一样的。不同点:方法传递的参数不同，apply(obj,[arg1,arg2..])call(obj,arg1,arg2)原型：所有对象都有一个原型，对象可以共享其原型的属性，但是这种共享是单向的，即原型的属性影响对象，改变对象确不会影响到原型。原型污染：使用for/in遍历对象的时候，会同时得到本来的属性和原型的属性，可以使用HasOwnPorperty方法来判断。匿名函数：一般用来写已加载就需立即执行的函数。同时为了避免受全局变量的影响，在一个不是很熟悉的页面增加Javascript时非常有效。8.Div和Span有何区别？答：两者最明显的区别在于DIV是块元素，而SPAN是行内元素(也译作内嵌元素)。所谓块元素，是以另起一行开始渲染的元素，行内元素则不需另起一行，当然这一点也可以通过设置display（block,inline,inline-block）来改变。9.CSS+DIV开发Web页面的优势有哪些？答：1）CSS+DIV，这个网页设计模式中，DIV承担了网页的内容，CSS承担了网页的样式。这样就使网页的内容和样式的分离开来。有利于页面的维护升级。2）有助于提高搜索引擎亲和力（快速找到需要的数据，而不是像在TABLE中一层层的查找）3）有助于页面的重构(换皮肤如blog，直接套用另外一套样式就可以实现，而不用改动网页脚本。)10.setInterval与setTimeout的区别？答：setTimeout方法是定时程序，也就是在什么时间以后干什么。干完了就拉倒。setInterval方法则是表示间隔一定时间反复执行某操作。11.Ajax及其优缺点：答：AsynchronousJavaScriptandXML”（异步JavaScript和XML)。在浏览器中使用js进行服务器的请求与响应，使得可以在不更新整个页面的前提下维护数据。其名字中的xml并非指只支持xml这一种文本格式，xml只是一个选择而已，其他还可以是表单与json。这样做只是xml流行时的遗迹。优点：使用Ajax的最大优点就是可以实现页面的局部刷新，提高用户体验质量。其他优点有使用异步方式与服务器通信，不需要打断用户的操作，具有更加迅速的响应能力。3、可以把以前一些服务器负担的工作转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节约空间和宽带租用成本。并且减轻服务器的负担，ajax的原则是“按需取数据”，可以最大程度的减少冗余请求，和响应对服务器造成的负担。4、基于标准化的并被广泛支持的技术，不需要下载插件或者小程序。缺点：1.干掉了back按钮。因为在未刷新页面的时候是无法使用back按钮的。2.安全问题，将一些数据、逻辑暴露在了前台。3.对搜索引擎的支持较弱。4.违背了Url资源定位的初衷。12.Prototype属性的相关注意问题与apply的使用常用于实现继承。Call与apply的作用相同，只是参数的形式不一样而已。如func.call(func1,var1,var2,var3)对应的apply写法为：func.apply(func1,[var1,var2,var3])Call的使用的使用14.JS中事件绑定，什么时候有前缀on，什么时候没有？兼容性问题。答：下图显示了采用三种方式注册的事件。兼容性问题可见：注意这两句写法：vare=e||window.event;varTarget=e.srcElement||e.target;15.关于ajax中的乱码问题答：因为js是以utf-8编码的，解决方案就是将前台页面和后台都统一编码为UTF-8。16.关于cookie的使用机制答：cookie用于保存状态以及为浏览器提供一种身份识别机制（因为http请求是无状态的，因此需要cookie的配合），在js中使用cookie无加密，因此不安全。但是https协议可以提供加密。17.background-color和backgroundColor答：background-color在css或者标签属性中使用里用，backgroundColor在js处理css里用,是DOM.style.backgroundColor,要注意大小写。还有很多其他的类似。18.DOCTYPE的作用答：HTML中!DOCTYPE标签的作用是什么呢？!DOCTYPE声明位于文档中的最前面的位置，处于html标签之前。此标签可告知浏览器文档使用哪种HTML或XHTML规范。该标签可声明三种DTD类型，分别表示严格版本(Strict)、过渡版本(Transitional)以及基于框架的HTML文档(Frameset)。19.行内元素与块级元素答：块级元素一般是从新行开始，而行内元素不是。块级元素一般用来搭建网站架构、布局、承载内容，像这些大体力活都属于块级元素的，它包括以下这些标签：address、blockquote、center、dir、div、dl、dt、dd、fieldset、form、h1~h6、hr、isindex、menu、noframes、noscript、ol、p、pre、table、ul内嵌元素一般用在网站内容之中的某些细节或部位，用以“强调、区分样式、上标、下标、锚点”等等，下面这些标签都属于内嵌元素：a、abbr、acronym、b、bdo、big、br、cite、code、dfn、em、font、i、img、input、kbd、label、