前端关东煮---js,jq,css3,h5个人小总结（一）

HTML5基础
①请描述一个网页从开始到最终显示的完整过程:

1.在浏览器中输入网址；

2.发送至DNS服务器并获得域名对应的web服务器的IP地址；

3.与WEB服务器建立TCP连接；

4.浏览器向WEB服务器的IP地址附送相应的HTTP请求;

5.WEB服务器相应请求返回URL的数据

6.浏览器下载数据后解析HTML文件

浏览器中输入地址 通过DNS获取IP地址 建立TCP连接 获取HTTP请求 返回URL数据 解析HTML文件 显示界面
②TCP和UDP的区别

TCP：传输控制协议 是基于连接的协议 在正式收发数据前必须和对方建立可靠的连接 一个TCP连接必须要经过三次对话才能建立

UDP:用户数据协议 与TCP相对应的协议 不与对象建立连接直接把数据包发过去 UDP可靠性不高 适用于一次连接

③DOCTYPE声明的作用是什么？严格模式和混杂模式如何区分？？

DOCTYPE是为了能够让浏览器清楚你的文档的版本类型和风格，需要在文档的起始来指定当前文档的风格和版本

DOCTYPE声明在文档的最前面

严格模式（标准模式） 浏览器根据规范呈现页面；在混杂模式中，页面以向后兼容的方式显示，防止老站点无法兼容
如果html文档包含完整的DOCTYPE，那么他一般以标准模式呈现。
⑤简单的描述一下浏览器的内核
浏览器内核负责对网页语法的解释并显示网页，他决定了浏览器如何显示网页的内容以及页面的格式信息.

常见的浏览器内核有

Trident：IE浏览器

Gecko：Mozilla浏览器，比如Firefox

Webkit:Safari浏览器，也是Chrome浏览器的内核

Blink:Chrome浏览器，Opera浏览器

⑥如何理解html语义化？

语义化的主要目的在于，直观的认识标签和属性的作用，简单来说就是用正确的标签干正确的事情
html语义化可以让网页的内容语义化，更容易让浏览器辨析，并且提高代码的可重用性
⑦表单向服务器提交数据有几种方式？这些方式都有什么区别？？

想表单提交数据的两种方式是get和post两种方式

浏览器发送给服务器的HTTP请求分别为请求头和请求主体两部分。

使用GET方式向服务器发送数据表单的时候，表单数据将附加在URL属性的末端。采用post方法发送数据时，

数据汇放在主体中发生.
表单向服务器提交数据的两种方式get和post两种提交方式

浏览器发送给服务器的HTTP请求分别为请求头和请求主题两部分。

使用GET向服务器提交表单数据的时候，数据实在URL里进行提交的。使用post向表单提交数据时，数据是在主体中提交的。

css3基础

①link和@import都可以为页面引入css文件，其区别是？
link的方式：

<link rel="stylesheet" type="text/css" href="aa.css">

@import方式：

<style type="text/css">

@import"aa.css";

</style>
②position的值，relative和abolute分别是相对于谁进行定位的？？

abolute:生成绝对定位的元素，相对于最近的一级的定位不是static的父级元素来进行定位。

absolute绝对定位absolute绝对定位absolute绝对定位absolute绝对定位absolute绝对定位absolute绝对定位

fixed（老IE不支持）生成绝对定位的元素，相对于浏览器窗口进行定位

relative生成相对定位的元素，相对于其在普通流中的位置进行定位

relative相对定位relative相对定位relative相对定位relative相对定位relative相对定位relative相对定位

static 默认值。没有定位元素出现在正常的流中

sticky生成粘性定位的元素，容器的位置根据正常文档流计算得出
③哪些属性可以继承？？

CSS中可以继承的属性如下:

1.文本相关属性：font-family,font-size,font-style,font-variant,font-weight,font,letter-spacing,

line-height,text-align,text-indent,texy-tranform,word-spacing,color;

2.列表相关属性：list-style-image,list-style-position,list-style-type,list-style;

3.表格相关属性：border-collapse,border-spacing

4.其他属性：Cursor,visibility
④display属性和visibility属性的区别？？

可以使用display属性定义建立布局时元素生成的显示框类型.

1.如果将display属性设置为block，可以让行内元素（比如<a>元素）表现得像块级元素一样;

2.如果将display属性设置为inline，可以让块级元素(比如<p>元素)表现的像内联元素一样；

3.可以通过把display属性设置为none,让生成的元素根本没有框，这样该框以及其文本内容都不再显示不占用文档中的空间
在DIV设计中，使用display:none属性后，HTML元素（对象）的宽度，高度等各种属性都会“丢失”

用了visibility：hidden以后HTML仅仅是视觉上的看不见（完全透明）,而它所占据的空间位置仍然存在..
⑤简述对CSS的盒子模型理解??

CSS盒子模型也叫做框模型 border margin padding这三种

border：元素的边框，用于将框的边缘与其他框分开

margin:外边距表示框的边缘与外边框的距离，也称为页边空白

padding:内边距，表示框内容和框之间的空间。
⑥如何居中一个DIV？如何居中一个浮动元素？

1.精确计算其左外边距并进行设置，实现居中显示。

2.使用一个居中显示的DIV元素包含此浮动元素，代码如下：

<div style="margin:0px auto"><div style="float:left"></div></div>
⑦CSSSPRIT是什么？谈谈这个技术的优缺点？？

CSSSPRIT是一种网页图片应用的处理方式，就是把网页中的一些背景图片整合到一张图片文件中，再利用css的"background-image","backgrond-repeat"

,"background-position"的组合进行背景定为。
⑧对CSS3有了解么？列举几个css3的新特性并简要描述？

css3是css技术的升级版本,选择器，盒子模型，列表模块，背景和边框等加入了很多新的属性比如复杂选择器，文字阴影，边框圆角，边框阴影，

渐变，过度，多栏布局，2D/3D转换，动画等。
⑨什么是css rest?

css rest又叫做 css重写或者css重置，用于改写HTML标签的默认样式。

⑩谈谈浮动和清除浮动

浮动的框可以向左或向右移动，直到他的边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的普通流中，所以文档的普通刘的块矿

就像浮动框不存在一样。
谈谈你对浏览器兼容的问题的理解

浏览器的类型及版本的不同会造成Css效果不尽相同
px和em和rem的区别？

px和em都是长
4000
度单位，区别在于px的值是固定的 px的num是多少就是多少 计算比较容易。

em会继承父级元素的字体大小.

浏览器的默认字体高度是16px，未经调整的浏览器都符合：1em是16px 随着em的改变px会改变。

rem用来设置web页面字体大小声明在你想用的大的div中

1.在浏览器中输入域名 2.通过dns获取ip地址 3.建立tco链接 4.获取http请求 5.返回url数据 6.解析数据 7。显示页面

javascript

①简要描述javascript的数据基本类型？？

javacript的数据可以分为原始类型和对象类型

原始类型包括string,number,boolean三种类型.

复杂数据类型array object date等

特殊的原始值：null和undefind
javascript中的类型

string num boolean array date object null undefind

②描述null和undefinde的区别？？

null是javascript中的关键字，用来描述为空值 如果要对null进行typeof操作那么将会返回object,代表着没有无的意思

undefind指“未定义”的意思，表示变量没有初始化
③javascript中局部变量和全局变量的区别

全局变量拥有全局作用域，在javascript任何地方都可以访问；在函数里声明的变量叫做局部变量。

④什么是javacript中的函数作用域

javascrit中的函数作用域是指：函数内声明的所有变量都被提前至函数的顶部声明。

函数内声明的所有变量必须提前至函数的顶部声明

函数内声明的所有变量必须提前至函数的顶部声明
⑤简述argument对象的作用

在函数代码中，使用特殊对象argument可以访问函数的参数。

开发者在定义函数的时候，无需明确的为方法声明参数，也可以在方法中使用arguments来访问参数。
⑥编写函数，冒泡排序

function aa(arr）{
for(var i=0;i<arr.length;i++){

for(var j=0;j<arr.lenght-1-i;j++){

if(arr[j]>arr[j+1]){

var temp=arr[j];

arr[j]=arr[j+1];

arr[j+1]=temp;

}

}

⑦编写排序，实现插入排序
function inertintotr(arr){
for(var i=0;i<arr.lenghth;i++）{
var k=arr[i];

for(var j=j-1;j>=0&&k<arr[j];j--){

arr[j+1]=arr[j];

}

arr[j+1]=k;

}

}

}

⑧什么是正则表达式？在javascript中，如何应用正则表达式？

正则表达式本身就是一个字符串，由一些普通字符和特殊字符组成的，用来描述某种特定的字符规则的表达式.
⑨javascript中的匿名函数

匿名函数是指在定义时没有指定名字的函数，定义完之后直接调用。
⑩简要描述javascript中的作用域链

任何一段javascript代码都对应一个作用域链，作用域链中存放一系列对象，代码中声明的变量将作为对象的属性存放。
11.简要描述你对闭包的理解

函数对象可以通过作用域链相互关联起来，函数体内部的变量都可以保存在函数作用域内，这种特性叫做闭包。
12.javascript中，this关键字的作用是什么？

this带指的就是当前的对象，顶级代码中的this指向全局对象，在指定元素事件内的时候this带指当前发生的事件的元素对象。
13.简述你对javascript中原型的理解？

函数本身就是一个包含方法和属性的对象。所存储的prototype属性就是原型。
14.js继承方式及其优缺点

原型链继承的缺点

重写原型会中断关系，使用引用类型的原型，并且子类型无法给父类型传值。
15.简要描述call和apply的区别。

call和apply都用于间接调用函数。

call和apply作用相同都是调用一个对象的方法，用另一个对象代替当前对象。

call的第二个参数表示将被传方法的序列

aooly的第二个参数表示将多个参数组合成一个参数数组以一个数组的形式传入。
16封装

封装了的属性名必须用get来调用 直接调用属性

会undefinde

赋值必须set属性名(参数)的方法赋值.

17.javascript的typeof返回类型都有哪些？

object boolean undefinde number function
18.强制转换和隐式转换的方法？

强制转换 parseint parsefloat number

隐式转换 +-
19.split和join的区别。

split切割成数组，join数组转换成字符串
20.ie在标准下的兼容都有哪些写法？？

var ev window.event;
21.在ajax请求的时候get和post方式的区别.

一个在url后面一个在虚拟载体里面.

有大小限制

安全问题

一个类似论坛一个类似修改密码。
22.事件委托

让利用事件冒泡的原理，让自己触发的事件，让父元素代替执行。

jsonp的出现是为了解决同源策略的问题的
23javascript的本地对象，内置对象和宿主对象

本地对象可以new实例

内置对象为goldmath不能实例化

宿主对象为自带浏览器的document,window等。
24.documentload和documentready的区别

document.onload是在结构和样式加载完才执行js

document.ready原生种没有这个方法

load是javascript中dom元素body事件

25.eval是做什么的？？

它的功能是把对应的字符串解析成js代码并执行；

不建议使用eval不安全，非常的耗性能
26.xml和json的区别？

①数据体积方面：json相对于xml来说，数据的体积小，传递的速度更快.

②数据交互方面：json与javascript的交互更加便利，更容易解析处理，更好的数据交互。

③数据描述的方面：json的性能不如xml

④数据传递速度方面：j远远快于xml
27.异步加载的方法有哪些?94. 100 122 131

defer只支持ie

async；

创建script，插入到dom中，加载完毕后callback

28.哪些操作会造成内存泄漏？

内存泄露指的是任何对象在您不再拥有或需要它之后仍然存在

settimeout的第一个参数使用字符串而绝非函数的话会引发泄露
29在jquery中实现动画效果的函数是什么？

animate()函数

animate（）方法通过css样式把一个元素从一个状态转换为另一个状态。
30请描述一下cookie,sessionstorge,localStorage的区别

sessionStroage用于存储本地第一个会话数据，这些数据只能在同一个会话中的页面才能访问。sessionStrage不是一种持久化的本地数据，仅仅是会话级别的

cookie的大小要收到限制每次你请求一个新的cookie都会发送一次请求比较麻烦

webstrage只限于本地存储
dom
①谈谈innerhtml,nodevalue,textcontent之间的区别

innerhtml用于读取或者设置起始和结束。

nodevalue属性读取或者设置指定节点的文本内容。获取指定节点的内容。用于文本。

textcontent返回包含所有子节点中的文本内容。

②总结可以实现页面跳转和刷新的方法。

1.使用超链接，代码如。

<a href="url"></a>

2.表单提交，代码如：

<form acrtion="url"></form>

3.js代码：

window.open('url');

history.go();'

location.href="url";

html5

①什么事web worker?为什么我们需要他们？

webworker用于异步处理执行javascript文件,提高浏览器的敏捷度.

②那些属性第一了必填的？

required（)指定了是否必填。
③html5中的geolocation api 实现获取用户位置的方法？

使用getcurrentpoition来获取方法。
④html5为什么只需要<doctype html>?

因为html5不基于sgml.
⑤html5中的新增元素有哪些？？移除了那些元素？如何处理html5新标签的浏览器兼容问题？？

内容元素：article,footer,header,nav,section

表单控件：calender,date,time,email,url,search'
处理兼容问题的两种方式:

ie6/ie7/ie8支持通过document方法产生的标签，利用这些特性让html支持新元素。

使用html5shim框架.

343537384142
⑥html5的离线存储怎么使用，工作原理是什么？

localstorge长期存储数据,浏览器关闭后数据不丢，因为都存在了本地。

sessionstrorge数据在浏览器关闭的时候消失。
⑦iframe有哪些缺点？？

页面比较混乱

有些程序无法解读这种框架结构
⑧常见兼容性问题？

margin和padding不同。

png24位图片在ie6上出现背景.

超链接访问过后hover效果不出现。

ie6双距bug
⑨如何实现浏览器内多个标签页之间的通信？

localstorge,cookies等本地存储方式
⑩css3新增伪类举例

p:first-of-type首个p元素的每个p元素

p:last-of-type最后p元素的每个p元素

p:only-of-type唯一p元素的每个p元素

p:only-child父元素唯一子元素的每个p元素

p：nth-child(2)父元素第二个子元素的每个p元素
css3新增的特性？

border-radius 圆角 box-shadow阴影 text-shadow文字阴影 transform旋转

jquery
①body中的onload()函数和jquery中的$(document).ready有什么区别？？

document.ready()在页面中可以使用多个 在dom页面加载完以后刁勇

document.onload只能使用一次 在所有元素加载完以后调用
②$的作用$是jquery的别名可以被代替

③defer和async的区别

defer并行加载js文件，会按照页面的script顺序执行

async并行加载js文件，加载完毕后不会按照script顺序执行