Skip to content

Commit 9bcd07a

Browse files
committed
Built Programing-In-Javascript from commit df39471 on branch master
1 parent 880da68 commit 9bcd07a

File tree

7 files changed

+136
-28
lines changed

7 files changed

+136
-28
lines changed

Browser_Scripting/DOM_Scripting/EventAPI.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width">
77
<meta http-equiv="X-UA-Compatible" content="IE=edge">
8-
<meta name="description" content="Javascript编程语言 - 一本开源的Javascript编程指南; An open-sourced Javascript Guide and Tutorial">
9-
<meta name="keywords" content="Javascript, guide, open-sourced">
8+
<meta name="description" content="Javascript编程语言 - 一本开源的Javascript编程指南; An open-sourced Javascript Guide and Tutorial; Event接口 事件机制无时无刻伴随着Javascript开发。在浏览器环境里有各种各样的事件。正是这些事件驱动着脚本的运行。 Javascript的事件机制也是一个标准的观察者模式(Observer Pattern)的应用。通过抽象出订阅者(Subscriber)和发布者(Publisher)来达到接偶某个事物的目的。这样一种普遍的设计模式,不仅仅可以用在DOM里的事件机制,应用程序的脚本也可以">
9+
<meta name="keywords" content="Javascript, guide, open-sourced ,决定,,0,,2,,3,,#,,Event,,接口,,事件,,机制,,无时无刻,,伴随着,,Javascript,,开发,,。,,在,,浏览器,,环境,,里,,有,,各种各样,,的,,正是,,这些,,驱动,,着,,脚本,,运行,,也是,,一个,,标准,,观察者,,模式,,(,,Observer,,Pattern,,),,应用,,通过,,抽象,,出,,订阅,,者,,Subscriber,,和,,发布者,,Publisher,,来,,达到,,接偶,,某个,,事物,,目的,,这样,,一种,,普遍的,,设计,,,,,不仅仅,,可以,,用,,DOM,,应用程序,,也,,构建,,自己,,模型,,产生,,自定义,,推动,,进行,,例如,,`,,Backbone,,.,,就是,,常见的,,EventEmitter,,实现,,它,,允许,,任何,,对象,,派发,,而,,不,,局限,,于,,中的,,文档,,元素,,作为,,中,,最,,完善,,复杂的,,自然,,是,,程序员,,首先,,要,,掌握,,概述,,EventTarget,,节点,,内,,传播,,或,,总是,,沿着,,其,,附,,所,,构成,,有序,,列表,,编程,,时时,,源头,,很多,,同时,,存在,,多种,,形式,,从事,,件,,看,,拥有,,能够,,接受,,都,,了,,下面,,这,,三个方,,法,,大家,,应该,,陌生,,addEventListener,,(,,),,removeEventListener,,dispatchEvent,,大多,,有如,,下,,继承,,状态,,:,,-,,&gt;,,Node,,|,,Element,,HTMLElement,,Document,,如上所述,,素,,我们,,获取,,都是,,相关,,方法,,但,,由于,,历史,,原因,,大量,,时期,,即,,没有,,标准化,,代码,,使用,,以下,,两种,,办法,,注册,,监听,,:,,*,,HTML,,属性,,&lt;,,button,,onclick,,=,,&quot;,,alert,,&#x27;,,Hello,,world,,!,,myButton,,function,,event,,{,,;,,},,调用,,需要,,遵循,,该,,行为,,自动,,相应,,整个,,流程,,如下,,1,,时间,,路径,,将要,,组成,,里面,,这个,,最后,,一点,,Target,,本身,,之前,,祖先,,[,,Flow,,],,eventflow,,png,,关于,,两个,,特性,,一旦,,被,,确定,,即使,,后续,,操作,,改变,,结构,,不会,,影响,,内容,,更,,处理,,函数,,callback,,、,,handler,,subscriber,,过程,,出现,,捕获,,异常,,也不,,会,,三个,,阶段,,capture,,phase,,目标,,target,,冒泡,,bubble,,标记,,bubbles,,描述,,是否,,经历,,eventPhase,,正在,,正,,处于,,哪个,,对,,stopPropagation,,阻止,,继续,,接着,,上,,每个,,listeners,,此时,,按照,,条件,,向,,哪些,,stopImmediatePropagation,,立刻,,停止,,的确,,pahase,,类型,,type,,当,,完成,,所有,,周期,,后,,currentTarget,,必须,,设置,,为,,null,,其他,,保持,,不变,,可,,递归,,如果,,要求,,新的,,新,,同步,,执行,,并且,,只有,,完毕,,才,,默认,,preventDefault,,通常,,包含,,有一些,,取消,,抛弃,,就,,那么,,后果,,将,,重置,,cancelable,,;,,defaultPrevented,,已经,,返回,,值,,反应,,激活,,Activataion,,用户,,或者,,另外,,连带,,触发,,比较,,而且,,大多数,,不支持,,但是,,聚焦,,Focused,,链接,,敲击,,Enter,,键,,页面,,跳转,,重新,,定位,,Activation,,Trigger,,keydown,,Behavior,,有趣的,,并,,不是,,由,,click,,模拟,,鼠标,,左,,点击,,除了,,keypress,,之外,,还,,想象,,一下,,语音,,控制,,触屏,,交互,,网页,,浏览,,场景,,做法,,有道理,,保证,,大,,兼容性,,可信,,发生,,变化,,DocumentEvent,,createEvent,,创建,,initEvent,,初始化,,以及,,合成,,不可信,,isTrusted,,大部分,,不允许,,DOMActivate,,除外,,模块,,常见,,分类,,UIEvent,,MouseEvent,,WheelEvent,,KeyboardEvent,,CompositionEvent,,InputEvent,,FocusEvent,,参考,,http://www.w3.org/TR/DOM-Level-3-Events,,http://www.w3.org/html/wg/drafts/html/master/webappapis.html#event-handler-attributes">
1010
<link rel="stylesheet" type="text/css" href="/style.css" />
1111

1212
</head>
@@ -123,8 +123,8 @@ <h2 id="-">参考文档</h2>
123123
</div>
124124
<div class="right">
125125
<ul class="inline-list">
126-
<li>Rev <a href="https://github.com/RobinQu/Programing-In-Javascript/tree/02c06c3/chapters/Browser_Scripting/DOM_Scripting/EventAPI.md">02c06c3</a></li>
127-
<li>2014-04-02T09:41:19.345Z</li>
126+
<li>Rev <a href="https://github.com/RobinQu/Programing-In-Javascript/tree/5a615fc/chapters/Browser_Scripting/DOM_Scripting/EventAPI.md">5a615fc</a></li>
127+
<li>2014-04-03T09:30:00.829Z</li>
128128
</ul>
129129
</div>
130130
</footer>

Browser_Scripting/Document_Loading/ScriptExecution.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width">
77
<meta http-equiv="X-UA-Compatible" content="IE=edge">
8-
<meta name="description" content="Javascript编程语言 - 一本开源的Javascript编程指南; An open-sourced Javascript Guide and Tutorial">
9-
<meta name="keywords" content="Javascript, guide, open-sourced">
8+
<meta name="description" content="Javascript编程语言 - 一本开源的Javascript编程指南; An open-sourced Javascript Guide and Tutorial; 脚本执行方式 执行入口 script标签 eval函数 Function构造函数 setTimeout和setInterval函数 HTML标签内的事件绑定相关的內联函数(onclick等) 其他hacks script标签 最基本,最常用的脚本引入方式。例如: &lt;script src=&quot;http://code.jquery.com/jquery-1.11.0.min.js&quot;&gt;&lt;/script">
9+
<meta name="keywords" content="Javascript, guide, open-sourced ,-,,0,,2,,3,,4,,5,,#,,脚本,,执行,,方式,,入口,,*,,script,,标签,,`,,eval,,函数,,Function,,构造,,setTimeout,,和,,setInterval,,HTML,,内,,的,,事件,,绑定,,相关,,內联,,(,,onclick,,等,,),,其他,,hacks,,最,,基本,,,,,常用的,,引入,,。,,例如,,:,,&lt;,,src,,=,,&quot;,,http://code.jquery.com/jquery-1.11.0.min.js,,&gt;,,/,,尽管,,在,,XHTML,,里面,,要求,,开发者,,使用,,type,,属性,,来,,制定,,类型,,但是,,主流,,浏览器,,都,,默认,,认为,,是,,text,,javascript,,规范,,[,,^,,],,完全,,可选,,is,,evil,,有,,访问,,本地,,scope,,权利,,var,,a,,;,,(,,),,true,,function,,“,,first,,1,,class,,citizen,,”,,;,,自然,,相应,,new,,arg,,,,,.,,fnStr,,本质,,创建,,一个,,对象,,其,,也,,并不,,能,,所在,,环境,,闭,,包,,只能,,作用,,域,,local,,全局,,global,,效果,,一样,,{,,func,,false,,},,alert,,&#x27;,,haha,,这个,,异曲同工,,之,,妙,,对,,也是,,类似的,,另外,,要说,,名,,以上,,几点,,除了,,方法,,之外,,strict,,模式,,下,,不,,可用,,回调,,href,,hello,,this,,Say,,这样,,如同,,click,,Target,,Phase,,运行,,了,,指向,,目标,,元素,,本身,,Hack,,利用,,MessageChannel,,新,,特性,,可以,,触发,,一些,,也许,,Javascript,,角落,,不少,,吧,,:,,http://www.w3.org/html/wg/drafts/html/master/scripting-1.html#the-script-element,,https://developer.mozilla.org/en-US/docs/functional-javascript/First-class_citizen,,https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function,,https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode,,https://github.com/kriskowal/asap/blob/master/asap.js">
1010
<link rel="stylesheet" type="text/css" href="/style.css" />
1111

1212
</head>
@@ -107,8 +107,8 @@ <h3 id="-hack">其他Hack</h3>
107107
</div>
108108
<div class="right">
109109
<ul class="inline-list">
110-
<li>Rev <a href="https://github.com/RobinQu/Programing-In-Javascript/tree/02c06c3/chapters/Browser_Scripting/Document_Loading/ScriptExecution.md">02c06c3</a></li>
111-
<li>2014-04-02T09:41:19.345Z</li>
110+
<li>Rev <a href="https://github.com/RobinQu/Programing-In-Javascript/tree/5a615fc/chapters/Browser_Scripting/Document_Loading/ScriptExecution.md">5a615fc</a></li>
111+
<li>2014-04-03T09:30:00.829Z</li>
112112
</ul>
113113
</div>
114114
</footer>

Browser_Scripting/Document_Loading/ScriptTag.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width">
77
<meta http-equiv="X-UA-Compatible" content="IE=edge">
8-
<meta name="description" content="Javascript编程语言 - 一本开源的Javascript编程指南; An open-sourced Javascript Guide and Tutorial">
9-
<meta name="keywords" content="Javascript, guide, open-sourced">
8+
<meta name="description" content="Javascript编程语言 - 一本开源的Javascript编程指南; An open-sourced Javascript Guide and Tutorial; Script标签和脚本执行顺序 这里详细聊聊和script标签相关的脚本执行顺序。 Script标签的默认行为 几个首要特性: script标签(不带defer或async属性)的会阻止文档渲染。相关脚本会立即下载并执行。 document.currentScript可以获得当前正在运行的脚本(Chrome 29+, FF4+) 脚本顺序再默认情况下和script标签出现的顺序一致 假设如下简">
9+
<meta name="keywords" content="Javascript, guide, open-sourced ,效果,,0,,2,,3,,4,,5,,6,,7,,8,,9,,10,,29,,#,,Script,,标签,,和,,脚本,,执行,,顺序,,这里,,详细,,聊聊,,script,,相关,,的,,。,,默认,,行为,,几个,,首要,,特性,,:,,*,,(,,不,,带,,`,,defer,,或,,async,,属性,,),,会,,阻止,,文档,,渲染,,立即,,下载,,并,,document,,.,,currentScript,,可以获得,,当前,,正在,,运行,,(,,Chrome,,+,,,,,FF,,),,再,,情况,,下,,出现,,一致,,假设,,如下,,简单,,代码,,[,,^,,],,,,,最终,,产生,,三个,,alert,,依次,,为,,“,,A,,”,,、,,B,,C,,&lt;,,!,,-,,HTML,,Code,,&gt;,,&quot;,,;,,/,,我们,,考虑,,有,,网络,,请求,,code,,src,,=,,https://snipt.net/raw/7b08744009c450e07c0bfc1d606fc72e/,,https://snipt.net/raw/a2e8c05c1f6fc0e47d259aa899304e89/,,https://snipt.net/raw/4fab3017d3d46cbfc4bbd88aab006650/,,文件,,都,,需要,,先,,且,,第二个,,尺寸,,远大,,于,,另外,,两个,,但,,结果,,依然,,是,,弹出,,内容,,分别,,从,,上面,,例子,,可以,,充分,,了解到,,柱塞,,式,,新,,这,,意味着,,其,,兼容性,,并不,,乐观,,IE,,表示,,该,,也不,,同步,,浏览器,,只,,在,,完毕,,后,,即可,,—,,不必,,页面,,等待,,得到,,但是,,true,,看到,,加入,,并没有,,后续,,解析,,考究,,这个,,原有,,实有,,大量,,加载,,器,,做,,这样,,事情,,var,,createElement,,file,,js,,body,,appendChild,,不难,,想象,,通过,,异步,,插入,,达到,,1,,一样,,换句话说,,由,,对,,內联,,设置,,没,,有意义,,其他,,包含,,总是,,带有,,同样,,推迟,,并且,,不会,,就,,如同,,放置,,到了,,末尾,,之前,,宏观,,现象,,加,,了,,都会,,原理,,不一样,,确保,,即使,,过程,,中,,已经,,变成,,可执行,,状态,,也,,直到,,DOMContentLoaded,,同时,,彼此,,之间,,能,,保证,,注意,,不是,,每个,,支持,,即便,,因为,,版本,,导致,,具体,,不一致,,大家,,将,,到,,这种,,简单的,,做法,,早在,,被,,支,,持,,现代,,区别,,以上,,才,,开始,,按照,,标准,,与,,影响,,参考,,W,,官方,,互相,,There,,are,,three,,possible,,modes,,that,,can,,be,,selected,,using,,these,,attributes,,If,,the,,attribute,,is,,present,,then,,will,,executed,,asynchronously,,as,,soon,,it,,available,,not,,but,,when,,page,,has,,finished,,parsing,,neither,,fetched,,and,,immediately,,before,,user,,agent,,continues,,归纳,,仅有,,没有,,期间,,规范,,里,,提到,,两种,,有时,,这是,,允许,,在后面,,讨论,,write,,docuemnt,,向,,打开,,流,,写入,,;,,内,,嵌,,里面,,就地,,添加,,考虑到,,:,,\,,https://snipt.net/raw/a2e8c05c1f6fc0e47d259aa899304e89,,观察到,,普通的,,你,,也是,,让,,人,,纠结,,反过来,,使用,,由于,,延迟,,时,,关闭,,任何,,所以,,不管,,还,,始终,,iframe,,http://caniuse.com/script-defer/embed/,,style,,width,,100%,,seamless,,border,,http://caniuse.com/script-async/embed/,,测试,,用例,,http://jsfiddle.net/nGeZP/,,http://jsfiddle.net/uPk4z/3/,,http://www.w3.org/html/wg/drafts/html/master/scripting-1.html#attr-script-async,,http://jsfiddle.net/6234b/,,http://jsfiddle.net/P85kR/,,http://peter.sh/experiments/asynchronous-and-deferred-javascript-execution-explained/,,https://www.webkit.org/blog/1395/running-scripts-in-webkit/,,http://www.w3.org/html/wg/drafts/html/master/scripting-1.html#attr-script-defer,,http://jsfiddle.net/3uEKM/1/,,http://jsfiddle.net/fV9Sv/">
1010
<link rel="stylesheet" type="text/css" href="/style.css" />
1111

1212
</head>
@@ -146,8 +146,8 @@ <h3 id="-">测试用例</h3>
146146
</div>
147147
<div class="right">
148148
<ul class="inline-list">
149-
<li>Rev <a href="https://github.com/RobinQu/Programing-In-Javascript/tree/02c06c3/chapters/Browser_Scripting/Document_Loading/ScriptTag.md">02c06c3</a></li>
150-
<li>2014-04-02T09:41:19.345Z</li>
149+
<li>Rev <a href="https://github.com/RobinQu/Programing-In-Javascript/tree/5a615fc/chapters/Browser_Scripting/Document_Loading/ScriptTag.md">5a615fc</a></li>
150+
<li>2014-04-03T09:30:00.829Z</li>
151151
</ul>
152152
</div>
153153
</footer>

0 commit comments

Comments
 (0)