前端基础知识积累

时间 2019-11-21

标签前端基础知识积累繁體版

原文原文链接

一、<!DOCTYPE>标签的定义与用法。javascript

<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于 <html> 标签以前。css

<!DOCTYPE> 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪一个 HTML 版本进行编写的指令。html

在 HTML 4.01 中，<!DOCTYPE> 声明引用 DTD，由于 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则，这样浏览器才能正确地呈现内容。 HTML5 不基于 SGML，因此不须要引用 DTD。提示：请始终向 HTML 文档添加 <!DOCTYPE> 声明，这样浏览器才能获知文档类型。java

二、行内元素和块级元素都有哪些？（能够参考下面的link，回答的比较全面） http://blog.sina.com.cn/s/blog_72c8c1150100q76q.htmlweb

摘抄积累一下：记住对行内元素设置宽度width 无效。设置高度height 无效，能够经过line-height来设置。设置margin 只有左右margin有效，上下无效。设置padding 只有左右padding有效，上下则无效。注意元素范围是增大了，可是对元素周围的内容是没影响的，看图上效果就知道了ajax

text-align属性是二者表现的又有不一样之处正则表达式

三、这个针对不一样的浏览器写不一样的CSS code的过程，就叫CSS hack! IE8 最新css hack： "\9"　例:"border:1px \9;".这里的"\9"能够区别全部IE和FireFox.（只针对IE9 Hack） "\0"　IE8识别，IE六、IE7不能. "*"　IE六、IE7能够识别.IE八、FireFox不能. ""　IE6能够识别"",IE七、IE八、FireFox不能.编程

百度百科里面说明的很清楚了：http://baike.baidu.com/view/1119452.htm跨域

四、css的层叠（1）、权重（2）、继承数组

做者样式做者能够在他的HTML文件中肯定一个外来的、独立的CSS文件做者能够将CSS信息包含在HTML文件内做者能够在一个HTML指令内结合CSS指令，这样作通常是为了在一个特殊状况下将整体的CSS指令抵消掉

读者样式读者能够在他的浏览器内设立一个地区性的CSS文件。这个CSS文件能够用在全部的HTML文件上。假如做者的CSS文件与读者的相冲突，那么读者能够肯定他想使用哪一个

浏览器的样式假如外部没有特别指定一个样式的话，通常浏览器本身有一个内在的样式

上面是一些答案，w3cshool里面的说明是： 层叠次序 当同一个 HTML 元素被不止一个样式定义时，会使用哪一个样式呢？通常而言，全部的样式会根据下面的规则层叠于一个新的虚拟样式表中，其中数字 4 拥有最高的优先权。一、浏览器缺省设置二、外部样式表三、内部样式表（位于 <head> 标签内部）四、内联样式（在 HTML 元素内部）

抽时间写个例子，测测这些标记的有啥不一样。

五、 position值都有哪些，CSS3都有哪些新内容.

六、了解浏览器的内核：浏览器最重要或者说核心的部分是“Rendering Engine”，可大概译为“解释引擎”，不过咱们通常习惯将之称为“浏览器内核”。负责对网页语法的解释（如HTML、JavaScript）并渲染（显示）网页。因此，一般所谓的浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不一样的浏览器内核对网页编写语法的解释也有不一样，所以同一网页在不一样的内核的浏览器里的渲染（显示）效果也可能不一样，这也是网页编写者须要在不一样内核的浏览器中测试网页显示效果的缘由。浏览器内核不少，若是加上全部的几乎没有什么人在用的非商业的免费内核，那么可能大约有10款以上甚至更多，不过一般咱们比较常见的大约只四种。

七、正则表达式： ^[1][358][0-9]{9}$ 电话号码的匹配 ^[\w-]+(.[\w-]+)*@[\w-]+(.[\w-]+)+$ 邮箱的匹配（还没验证，只是找到的一个参考答案，还会抽空验证一下的）

八、关于cookie的基础：

Cookie对象的属性以下所示：一、Name：获取或设置Cookie的名称。二、Value：获取或设置Cookie的Value。三、Expires：获取或设置Cookie的过时的日期和事件。四、Version：获取或设置Cookie的符合HTTP维护状态的版本。

Cookie对象的方法以下所示：一、Add：增长Cookie变量。二、Clear：清除Cookie集合内的变量。三、Get：经过变量名称或索引获得Cookie的变量值。四、Remove：经过Cookie变量名称或索引删除Cookie对象。

九、关于节点的操做：http://blog.sina.com.cn/s/blog_a564ddcd0101dws9.html 这个blog介绍的很详细，能够参考。

十、Sizzle是一个纯javascript CSS选择器引擎。（有空看看源码http://www.oschina.net/p/sizzle/） Sizzle是一个纯javascript CSS选择器引擎。通常选择器的匹配模式(包括jq1.2以前)，都是一个顺序的思惟方式，在须要递进式匹配时，好比$(‘div span’) 这样的匹配时，执行的操做都是先匹配页面中div而后再匹配它的节点下的span标签，以后返回结果。 Sizzle则采起了相反Right To Left的实现方式，先搜寻页面中全部的span标签，再其后的操做中才去判断它的父节点(包括父节点以上)是否为div，是则压入数组，不然pass，进入下一判断，最后返回该操做序列。

十一、关于javascript的很是基础的知识积累：（1）. HTTP协议的状态消息都有哪些?(如200、302对应的描述)

（2）. AJAX是什么? AJAX的交互模型(流程)? AJAX跨域的解决办法? ajax是什么？ AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。 AJAX 不是新的编程语言，而是一种使用现有标准的新方法。 AJAX 是与服务器交换数据并更新部分网页的艺术，在不从新加载整个页面的状况下。

（流程是什么）参考的答案（能够试试一下）： 1--启动获取XMlHttpRequest对象 2--open 打开url通道，并设置异步传输 3--send 发送数据到服务器 4--服务器接受数据并处理，处理完成后返回结果 5--客户端接收服务器端返回

应该能够判断状态的

跨域的解决办法如今还有一点看不懂，由于最基础的还没熟悉

（3）. 同步和异步的区别?

十二、你真的了解HTML吗？（摘抄过来答案） http://my.oschina.net/u/933915/blog/309477

1三、修改的代码：