浏览器开发基础培训汇总

原创 2011年01月12日 15:55:00

<!-- /* Font Definitions */ @font-face {font-family:宋体; panose-1:2 1 6 0 3 1 1 1 1 1; mso-font-alt:SimSun; mso-font-charset:134; mso-generic-font-family:auto; mso-font-pitch:variable; mso-font-signature:3 135135232 16 0 262145 0;} @font-face {font-family:"/@宋体"; panose-1:2 1 6 0 3 1 1 1 1 1; mso-font-charset:134; mso-generic-font-family:auto; mso-font-pitch:variable; mso-font-signature:3 135135232 16 0 262145 0;} /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {mso-style-parent:""; margin:0cm; margin-bottom:.0001pt; text-align:justify; text-justify:inter-ideograph; mso-pagination:none; font-size:10.5pt; mso-bidi-font-size:12.0pt; font-family:"Times New Roman"; mso-fareast-font-family:宋体; mso-font-kerning:1.0pt;} a:link, span.MsoHyperlink {color:blue; text-decoration:underline; text-underline:single;} a:visited, span.MsoHyperlinkFollowed {color:#606420; text-decoration:underline; text-underline:single;} /* Page Definitions */ @page {mso-page-border-surround-header:no; mso-page-border-surround-footer:no;} @page Section1 {size:595.3pt 841.9pt; margin:72.0pt 1.0cm 72.0pt 1.0cm; mso-header-margin:36.0pt; mso-footer-margin:36.0pt; mso-paper-source:0; layout-grid:15.6pt;} div.Section1 {page:Section1;} /* List Definitions */ @list l0 {mso-list-id:113524818; mso-list-type:hybrid; mso-list-template-ids:1103013852 252865926 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;} @list l0:level1 {mso-level-number-format:japanese-counting; mso-level-text:%1.; mso-level-tab-stop:21.0pt; mso-level-number-position:left; margin-left:21.0pt; text-indent:-21.0pt;} @list l1 {mso-list-id:384916866; mso-list-type:hybrid; mso-list-template-ids:978978430 1547051404 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;} @list l1:level1 {mso-level-text:(%1); mso-level-tab-stop:57.0pt; mso-level-number-position:left; margin-left:57.0pt; text-indent:-36.0pt;} @list l2 {mso-list-id:399325490; mso-list-type:hybrid; mso-list-template-ids:-1226132084 -339988088 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;} @list l2:level1 {mso-level-tab-stop:39.0pt; mso-level-number-position:left; margin-left:39.0pt; text-indent:-18.0pt;} @list l3 {mso-list-id:528835976; mso-list-type:hybrid; mso-list-template-ids:548974390 -1086677382 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;} @list l3:level1 {mso-level-text:(%1); mso-level-tab-stop:57.0pt; mso-level-number-position:left; margin-left:57.0pt; text-indent:-36.0pt;} @list l4 {mso-list-id:990208726; mso-list-type:hybrid; mso-list-template-ids:-1800745974 712557566 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;} @list l4:level1 {mso-level-tab-stop:39.0pt; mso-level-number-position:left; margin-left:39.0pt; text-indent:-18.0pt;} @list l5 {mso-list-id:1026713466; mso-list-type:hybrid; mso-list-template-ids:1006416372 2066771668 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;} @list l5:level1 {mso-level-text:(%1); mso-level-tab-stop:57.0pt; mso-level-number-position:left; margin-left:57.0pt; text-indent:-36.0pt;} @list l6 {mso-list-id:1092819925; mso-list-type:hybrid; mso-list-template-ids:-636311644 1668602302 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;} @list l6:level1 {mso-level-tab-stop:39.0pt; mso-level-number-position:left; margin-left:39.0pt; text-indent:-18.0pt;} ol {margin-bottom:0cm;} ul {margin-bottom:0cm;} -->

浏览器开发基础培训汇总

一. 背景知识

1.       必看规范

(1)       HTML 4.01: http://www.w3.org/TR/REC-html40/

重点: A) DTD, B) 理解 Element Tag Node

(2)       XML: http://www.w3.org/TR/2006/REC-xml-names11-20060816/

(3)       CSS2: http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113/

重点: A)Element type: Block and Inline.

      B)CSS Box Model

(4)       DOM2/3:http://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/ http://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407/

重点: A)Node tree

      B)API

(5)       HTTP 1.1: http://www.w3.org/Protocols/rfc2616/rfc2616.html

重点: A)Headers

      B)Cache control

(6)       URL: http://www.ietf.org/rfc/rfc1738.txt

重点:理解 URL 组成部分

2.       选看规范

(1)       URI: http://www.ietf.org/rfc/rfc3986.txt

(2)       Javascript   http://www.ecma-international.org/publications/standards/ecma-262.htm

(3)       Cookie(Http State management): http://www.ietf.org/rfc/rfc2965.txt

重点:了解 Session 如何维护控制 Session

3.       开发资源

(1)       Gecko: https://developer.mozilla.org/en/Gecko Reflow High level

(2)       Gecko Document View https://developer.mozilla.org/en/Gecko_Documentation_Overview High Level designs

(3)       Gecko presentations:https://developer.mozilla.org/en/Gecko_Presentations : Some slides about introduction overview and internals

(4)       Webkit High Level Overview: http://trac.webkit.org/wiki/HighLevelOverview

(5)       WebCore Rendering: http://trac.webkit.org/wiki/WebCoreRendering

(6)       WebCore Add Render Object: http://trac.webkit.org/wiki/LayoutAndRendering

(7)       Mozilla moduls: http://www.mozilla.org/about/owners.html

二. 窗口区域划分: Chrome Content

1.Content 是窗口中用来显示 HTML 内容的区域。 Chrome Content 之外的元素所占的区域集合:标题栏、工具栏、滚动条等占有的区域均属于 Chrome

三. 模块划分

浏览器因为涉及规范和技术比较多,按照功能划分为: ML Parser Javascript Layout Style System,  Network, Cache service, Session service, Plugin & Addon, Bindings, DOM, Shell, Widget(Render Object), Graphics, I18N(intl)

四. 模块关系

ML parser 解析 HTML 文件,生成 Node tree Style system 解析 CSS 内容 ;Bindings 负责 Javascript Node Tree 的交互; Shell 与用户交互,并且更新 Chrome Graphics 绘制 page content 区域;、 I18N 国际化支持

 

 

 

 

五. 内容层次

WebCore 中处理文档内容过程中,使用的三种结构。 HTML 文档结构化为 Page Tree 。每个 Page 建立模型后为 Frame Tree Frame Tree 显示到屏幕上为 FrameView Tree

 

Html Sample 1:

<html>

<frameset>

<frame id=A   />

<frame id =B  />

<frame id=C   />

</frameset>

</html>

Html sample 2

<html>

<body>

……..

<iframe id=A  />

<iframe id=B  />

<iframe id=C  />

</body>

</html>

 

 

六. WebCore 接口

1.       网络及 UI 接口: FrameLoadercClient

2.       DOM tree 接口: InspectorClient

3.       上下文菜单接口: ContextMenuClient

4.       图形界面接口: ChromeClient

5.       Java LoadListener Native WebCoreResource Webkit 的网络接口

七. WebKit 渲染

请看《 WebCore_Rendering.doc

八. 插件及扩展(略)

九. 附加资源

1.       URL load, 引用 firefox 图例 :

  https://developer.mozilla.org/en/Document_Loading_-_From_Load_Start_to_Finding_a_Handler#nsDocumentOpenInfo

 

Line Callout 3: 相当于WebFrame::loadResource

2.       Request process, 引用 Firefox 例图:

Line Callout 3: 类似Webkit FrameLoader https://developer.mozilla.org/en/The_life_of_an_HTML_HTTP_request

Line Callout 3: 类似Webkit WebFrame

ABB机器人基础培训资料整理与总结

之前对机械臂了解较少,这方面知识比较匮乏。只使用过PowercCube六自由度机械臂。 感谢ABB公司何老师的耐心指导。 学习资料汇总:(最重要的ABB Robot 官网就不列出了,这里以中文资料为主...
  • ZhangRelay
  • ZhangRelay
  • 2016年04月18日 10:46
  • 6919

SAP FI系列培训视频教程

说明: 一、总账模块 第一讲 系统概览 http://www.boobooke.com/v/bbk3456/ 第二讲 总账系统集成 http://www.boobooke.com/v/bbk...
  • zhongguomao
  • zhongguomao
  • 2013年06月25日 16:10
  • 2337

2015-2017机器人操作系统(ROS)及其应用暑期学校资料汇总 ROS Summer School 持续更新

综合信息:2015     2016 课程资料:2015     2016 全部课程视频链接:智能机器人运动与视觉实验室...
  • ZhangRelay
  • ZhangRelay
  • 2016年07月27日 09:08
  • 3828

零基础嵌入式Linux开发工程师培训

零基础嵌入式Linux开发工程师高端培训(ARM实战、系统移植、驱动开发、网络电子书开发) 适合人群:初级 课时数量:336课时 用到技术:ARM实战、系统移植、驱动开发 涉及项目:网络电子书...
  • xiarilove
  • xiarilove
  • 2014年10月27日 12:36
  • 562

嵌入式软件开发培训笔记——C高级 数据结构与算法基础

一)、数据结构 1、逻辑结构 (1)线性结构:线性表、栈、队列 (2)非线性结构:树、图 2、基本逻辑运算:最基本的逻辑操作,如:查询、插入、删除、修改等 3、存储结构(1)顺序存储(2)链接存储...
  • CSDN85391440
  • CSDN85391440
  • 2015年04月16日 13:03
  • 739

iOS,Android软件开发培训基础内容对比(一)

一、主流开发环境对比: 1.1 、iOS使用的主流开发环境为Xcode,运行字Mac 操作系统OXS上,目前Xcode的最新版本是9.0,2017年中发布。与前面版本相比,增加了不少内容,最突出的是...
  • leemboy
  • leemboy
  • 2017年11月16日 23:50
  • 49

Android开发学习路线_零基础Android移动开发就业培训教程

风舞烟BF-TECH之零基础3G Android移动开发就业班(月薪过万很轻松) 适合人群:初级 课时数量:893课时 项目展示 北风网软件工程师IT高端培训BF-TECH 3.0 C模块(A...
  • u013802231
  • u013802231
  • 2014年09月26日 13:05
  • 1015

android开发基础培训

  • 2015年09月06日 15:50
  • 2.16MB
  • 下载

PHP开发基础培训 中文版 PPT

  • 2009年09月25日 17:48
  • 492KB
  • 下载

EOS基础开发培训

  • 2012年01月10日 17:40
  • 8.29MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:浏览器开发基础培训汇总
举报原因:
原因补充:

(最多只允许输入30个字)