百度web前端课程之js

2. berg

3. !!"#$%&'$()(*+*,#-*".)/,0#)121,30%.)
4,#55*".)678)/,9:$90;
!<03$5)=/+/01"3-%>?@@>68AB>C6C>B3$9D>
A/1>3E@;
! B3+*)3$)F*3G3$5.)H#"IJF/3(9; berg
!"##$%$%&'&

4. ?#$%/1%):*
'&:/3,K),*3LM3D3$5J4/3(9;1#:
8H3%%*"K)J1$4*"5
N*34#K)J4*"5
F,#5K)M%%-K>>HHH;1$4*"5;1#:

5. 8M30)/O%*"$##$
!=/+/01"3-%)4/031P)QR;SMT
!8M*)(*035$)U)/"1M3%*1%9"*)#O)8/$5"/:
QV;SMT

6. Javascript
Javascript basic+

7. E9%,3$*
!E+*"+3*H
!=/+/01"3-%)O#")H*4)4"#H0*"
!=/+/01"3-%
!?,3*$%&@3(*)=/+/@1"3-%
!W(+/$1*()01"3-%3$5

8. Overview

9. NM2)=/+/01"3-%)X

10. B/$59/5*)#O)%M*)N*4
O#":)VYYZ;R

12. ()*+,&-./)&00123&4*5$66&7&85&*9)9:+//

13. =/+/@1"3-%)30)"*/,,2)5##(
7%)30),35M%H*35M%)/$()*D-"*003+*

14. !C"#%#%2-/,)EEC
!!9$1%3#$/,)
![2$/:31

15. F9%)%M*)*$+3"#$:*$%)30)
$#%)0#)5##(
A/I*)90)1#$O90*()/$()/$5"2

16. A/$2)4"#H0*"0
!7')Q))+*"03#$0T.)]"*O#D.)1M"#:*.)0/O/"3.)
#-*"/
!?M3$/
!^ZS
!A/D%M#$

18. [3c*"*$%)3:-,*:*$%
!=/+/01"3-%)*$53$*0
!?M/I"/)&)7'
!=_5*"A#$I*2)&)!3"*O#D
!`a)&)?M"#:*
!?/"/I/$)&)E-*"/)
!b3%"#)&)0/O/"3

19. [3c*"*$%)3:-,*:*$%
!N*4)4"#H0*")*$53$*0
!8"3(*$%)&)7'
!d*1I#)&)!3"*O#D
!N*4I3%)&)?M"#:*)U)@/O/"3
!C"*0%#)&)E-*"/)

20. Javascript

21. 9 function hello(to){
10 to = to || 'world';
11 alert("Hello " + to);
12 return true;
13 }
14 var to = 'everyone';
15 hello(to);

22. !B*D31/,)@%"91%9"*
![/%/%2-*)/$()`/,9*0
!`/"3/4,*0
!'D-"*003#$0)/$()E-*"/%#"0
!@%/%*:*$%0
!;;;

23. E9%,3$*
!@#:*)(3c*"*$1*
!E4G*1%
!!9$1%3#$
!C"#%#%2-*)EEC

24. @#:*)(3c*"*$1*0

25. `/"3/4,*0
<$%2-*(

26. 43 var i = 1;
44 i = 'something else';
45
46 alert(i + 1);

27. 49 var a = [1, 2, 3];
50 var b = a;
51 a[0] = 99;
52 alert(b);

28. !C"3:3%3+*)%2-*0) !e*O*"*$1*)%2-*0
!b9:4*"0 !E4G*1%0
!F##,*/$ !W""/20
!@%"3$5 !!9$1%3#$0
!$9,,
!9$(*]$*(

29. `/"3/4,*)@1#-*
b#)4,#1I)01#-*

30. 22 scope = 'global';
23 function checkscope() {
24 scope = 'local';
25 alert(scope);
26 myscope = 'local';
27 alert(myscope);
28 }
29 checkscope();
30 alert(scope);
31 alert(myscope);

31. 34 function f() {
35 alert(scope);
36 if (!scope) {
37 var scope = 'local';
38 }
39 alert(scope);
40 }
41 f();

32. E-%3#$/,)@*:31#,#$0
[E)bE8)O#"5*%)2#9")@*:31#,#$0

33. 54 var a = 1;
55 alert(a);
56
57 return
58 {
59 a: 1
60 };

34. @9::/"3L*
{ !<$%2-*()`/"3/4,*0
!`/"3/4,*)@1#-*
!E-%3#$/,)@*:31#,#$0

35. E4G*1%

36. }
! W""/20
! !9$1%3#$0
! e*59,/")*D-"*003#$0
Object
! E4G*1%
}
! b9:4*"0
! @%"3$50 Object-like
! F##,*/$

37. ?,/00&O"**
62 var info = {
63 first: 'Berg',
64 last: 'Lei',
65 address: {
66 city: 'Beijing',
67 street: 'Shangdi 10th street'
68 }
69 };

38. 71 info['first'];
72 info.first;
73
74 var key = 'first';
75 info[key];

39. 77 for (i in info) {
78 alert(info[i]);
79 }

40. C"#%#%2-*
82 function clone(o) {
83 var F = function() {};
84 F.prototype = o;
85 return new F();
86 }

41. 89 var student = {
90 university: 'CAS'
91 };
92 var someone = clone(student);
93
94 alert(someone['university']);
95
96 someone['name'] = 'john';
97 student['university'] = 'HIT';
98
99 alert(someone['university']);

42. C"#%#%2-*)1M/3$
null
someone student Object
name : john university: CAS toString : fn
someone['key']

43. @9::/"3L*
{ !?,/00&O"**
!C"#%#%2-*
!C"#%#%2-*)1M/3$

44. !9$1%3#$

45. 7$+#1/%3#$0

46. !9$1%3#$)3$+#1/%3#$
103 function add(a, b) {
104 return a + b;
105 }
106 add();

47. A*%M#()3$+#1/%3#$
108 var counter = {
109 value: 0,
110 increment: function(count) {
111 return this.value += count || 1;
112 }
113 };
114 alert(counter.increment());

48. NM/%f0)g%M30g

49. g%M30g)/,H/20)"*O*"0)%#)%M*)
#H$*")#4G*1%)#O)%M*)
O9$1%3#$)

50. W--,2)3$+#1/%3#$
118 function sum() {
119 var i, len = arguments.length, sum = 0;
120 for (i = 0; i < len; i++) {
121 sum += arguments[i];
122 }
123 return sum;
124 }
125
126
127 var arr = [1, 2, 3, 5];
128 sum.apply(this, arr);

51. !O9$1%3#$;/--,2Q!"#$%&'.)()*$Th
!!"#$%&')K)3$+#I*0)%M*)O9$1%3#$)/0)3O)3%)
H*"*)/):*%M#()#O)!"#$%&'
!()*$)K)-/003$5)3%)%M*)/"59:*$%0)
1#$%/3$*()3$)%M*)()*$)/""/2
!O9$1%3#$;1/,,Q!"#$%&'.)()*+,---T

52. ?#$0%"91%#")3$+#1/%3#$
132 var Counter = function(init) {
133 this.value = init || 0;
134 };
135 var myCounter = new Counter(5);
return a new object link to the
function's prototype member

53. ?,#09"*

54. var Counter = function() {
var value = 0;
return {
increment: function(inc) {
return value += inc || 1;
},
getValue: function() {
return value;
}
};
}();

55. ?,#09"*
!9$1%3#$)1/$)/11*00)%#)%M*)
1#$%*D%)3$)HM31M)3%)H/0)1"*/%*().)
'+*$)%M#95M)%M30)O9$1%3#$)M/0)
(+),(-./),!0)1,-;)

56. for (var i = 0; i < count; i++) {
nodes[i].onclick = function() {
alert(i);
};
}

57. for (var i = 0; i < count; i++) {
nodes[i].onclick = function(i) {
return function() {
alert(i);
};
}(i);
}

58. !9$1%3#$/,)-"#5"/::3$5
173 function multize(func) {
174 return function() {
175 var list = arguments[0],
176 ret = [],
177 more = [].slice.call(arguments, 0);
178
179 for (i = 0; i < list.length; i++) {
180 more[0] = list[i];
181 ret.push(func.apply(this, more));
182 }
183 return ret;
184 }
185 }

59. 187 function inc(value) {
188 return value + 1;
189 }
190 var multInc = multize(inc);
191
192 multInc([1, 2, 3]);

60. W+#3(
0%/%*)/$():9%/4,*)(/%/

61. A*:#3L/%3#$
195 function fibonacci(n) {
196 return n < 2 ? n : fibonacci(n - 1) +
fibonacci(n - 2);
197 }
198
199 for (var i = 0; i <= 10; i++) {
200 document.write(i + ': ' + fibonacci(i)
+ '<br />');
201 }

62. 203 var i = 1,
204 startTime = (new Date()).getTime();
205 while (i++) {
206 fibonacci(i);
207
208 if ((new Date()).getTime() - startTime
> 1000) {
209 alert(i);
210 break;
211 }
212 }

63. 214 var fibonacci = function() {
215 var cache = [0, 1];
216
217 var _fib = function(n) {
218 var result = cache[n];
219 if (typeof result == 'undefined') {
220 result = _fib(n-1) + _fib(n-2);
221 cache[n] = result;
222 }
223 return result;
224 };
225 return _fib;
226 }();

64. ?/01/(*
231 T.e('#header').
232 children().
233 on('click', function() {
234 alert('clicked');
235 });

65. A/I3$5)[@B Q[#:/3$)0-*13]1),/$59/5*0T

66. @9::/"3L*
{
!7$+#1/%3#$0
!!9$1%3#$
!A*%M#(
!1#$0%"91%#"
!/--,2

67. @9::/"3L*
!?,#09"*
{ !!9$1%3#$/,)-"#5"/::3$5
!A*:#3L/%3#$
!?/01/(*

68. C"#%#%2-/,)EEC

69. ?,/0031)-/%%*"$
H3%M
-"#%#%2-/,)-/%%*"$

70. C0*9(#1,/0031/,

71. 132 var Counter = function(init) {
133 this.value = init || 0;
134 };
135 var myCounter = new Counter(5);
return a new object link to the
function's prototype member

72. 243 var Person = function(name) {
244 this.name = name;
245 };
246 Person.prototype.getName = function() {
247 return this.name;
248 };

73. 243 var Person = function(name) {
244 this.name = name;
245 };
246 Person.prototype.getName = function() {
247 return this.name;
248 };
250 var Student = function(name, university) {
251 this.name = name;
252 this.university = university;
253 };
254 extend(Student, Person);
255 Student.prototype.getUniversity = function() {
256 return this.university;
257 };

74. 238 function extend(subClass, superClass) {
239 var F = function() {};
240 F.prototype = superClass.prototype;
241 subClass.prototype = new F();
242 }

75. W)4*%%*")g*D%*$(g

76. 266 function extend(subClass, superClass) {
267 var F = function() {};
268 F.prototype = superClass.prototype;
269 subClass.prototype = new F();
270 subClass.prototype.constructor = subClass;
271 subClass.superClass = superClass.prototype;
272 if (superClass.prototype.constructor !=
Object.prototype.constructor) {
273 superClass.prototype.constructor = superClass;
274 }
275 }
276
277 var Student = function(name, university) {
278 Student.superClass.constructor.call(this, name);
279 this.university = university;
280 };

77. C"#%#%2-/,)-/%%*"$

78. 285 var Person = {
286 name: 'unnamed',
287 getName: function() {
288 return this.name;
289 }
290 };
291
...
298 var student = clone(Person);
299 student.name = 'John';
300 student.study = function() {
301 alert("I'm studying.");
302 };
303 alert(student.name);
304 student.name = 'Tom';
305 alert(student.name);

79. 82 function clone(o) {
83 var F = function() {};
84 F.prototype = o;
85 return new F();
86 }

80. ?,/0031/,)3$M*"3%/$1*
!?"*/%3$5)/$)WC7)O#")H3(*0-"*/()90*;
!E%M*")-"#5"/::*"0)$#%)O/:3,3/")H3%M)
-"#%#%2-/,)3$M*"3%/$1*;
!b#%):*:#"2&*i13*$%;

81. C"#%#%2-/,)3$M*"3%/$1*
!`*"2):*:#"2&*i13*$%;
!7%0)-#H*"),3*0)3$)3%0)03:-,313%2;
!63(3$5)%M30)O/1%)(#*0):#"*)M/":)%M/$)
5##(;

82. @9::/"3L*

83. !=/+/01"3-%)30)"*/,,2)5##()/$()3:-#"%/$%
!6/+*)035$3]1/$%)(3c*"*$1*0)O"#:)%M*)
@EA')E86'e)BWbd<Wd'
![2$/:31
!C"#%#%2-/,)EEC
!!9$1%3#$/,
!!9$1%3#$0)/"*)]"0%)1,/00)#4G*1%0)

84. QA

85. Client-Side JavaScript

86. 'D/:-,*0)2#9f+*)0**$)0#)O/".
M/+*)$#)-/"%319,/")1#$%*D%

88. E9%,3$*
!N*4)F"#H0*")'$+3"#$:*$%
!',*:*$%0
!?/01/(3$5)@%2,*)@M**%0
!'+*$%0
!E%M*")O*/%9"*0

89. N*4)F"#H0*")'$+3"#$:*$%

90. N3$(#H)/0)d,#4/,)'D*19%3#$)?#$%*D%
309 var answer = 42;
310 alert(window.answer === answer);

91. N3$(#H)
E4G*1%0
01"**$
O"/:*0jk
8M* O#":0jk
19""*$% M30%#"2
H3$(#H
/$1M#"0jk
(#19:*$%
3:/5*0jk
,#1/%3#$
;;;
;;;

92. '+*$%)("3+*$
O#":)d<7

93. =/+/@1"3-%)/((0)
&,"(2#3))%#)%M*)1#$%*$%)
/$()3%0)-"*0*$%/%3#$

94. !?"*/%3$5)+309/,)*c*1%0)
!@#"%3$5)%M*)1#,9:$0)#O)/)%/4,*)
!63(3$5)1*"%/3$)1#$%*$%)/$()"*+*/,3$5)
(*%/3,0)0*,*1%3+*,2)/0)%M*)90*")g("3,,0)
(#H$g)3$%#)%M/%)1#$%*$%
!@%"*/:,3$3$5)%M*)4"#H03$5)*D-*"3*$1*)42)
1#::9$31/%3$5)(3"*1%,2)H3%M)/)H*4)0*"+*"

95. ',*:*$%

96. 1 <html>
2 <head>
3 <title>Sample Document</title>
4 </head>
5 <body>
6 <h1></h1>
7 <p>This is a <i>simple</i> document.
8 </body>
9 </html>

97. [EA)%"**
Document
<html>
<head> <body>
<title> <h1> <p>
"Sample Document" "Title" "This is a " <i> document
simple

98. 8"/+*"03$5)',*:*$%0

99. 314 function countNode(node) {
315 var numtags = 0;
316 if (node.nodeType == 1 /*Node.ELEMENT_NODE*/)
317 numtags++;
318 var children = node.childNodes;
319 for (var i = 0; i < children.length; i++) {
320 numtags += countNode(children[i]);
321 }
322 return numtags;
323 }
324 alert(countNode(document.body));

100. !$#(*;$#(*82-*
!$#(*;1M3,(b#(*0
![2$/:31)/""/2
!$#(*;%/5b/:*
!$#(*;3$$*"68AB
!$#(*;-/"*$%b#(*

101. !3$(3$5)',*:*$%0

102. 16 <ul id="my-ul">
17 <li>line1</li>
18 <li>line2</li>
19 <li>line3</li>
20 <li>line4</li>
21 </ul>
327 var myElement = document.getElementById('my-id');
328
329 var myList = document.getElementById('my-ul');
330 var myListItem = myList.getElementsByTagName('LI');
331 for (var i = 0; i < myListItem.length; i++) {
332 alert(myListItem[i].innerHTML);
333 }

103. !,+,4,1!55*%',*:*$%F27(Q#-6!)#1*T
!,+,4,1!55*%',*:*$%0F28/5b/:*
Q!(*7(4,T/
!,+,4,1!55*%',*:*$%0F2b/:*
Q1(4,6!)#1*T

104. A#(3O2)',*:*$%0

105. 337 function sortChildren(e) {
338 var children = [];
339 for (var x = e.firstChild; x != null; x = x.nextSibling) {
340 if (x.nodeType == 1 /* Node.ELEMENT_NODE */) {
341 children.push(x);
342 }
343 }
344
345 children.sort(function(n, m) {
346 var s = n.firstChild.data;
347 var t = m.firstChild.data;
348 if (s < t) return -1;
349 else if (s > t) return 1;
350 else return 0;
351 });
352 for (var i = 0; i < children.length; i++) {
353 e.appendChild(children[i]);
354 }
355 }
356 sortChildren(document.getElementById('my-ul'));

106. 359 var iNode = document.getElementsByTagName('i');
360 for (var i = 0; i < iNode.length; i++) {
361 var b = document.createElement('input');
362 var html = iNode[i].innerHTML;
363 b.type = 'button';
364 iNode[i].appendChild(b);
365 b.value = html;
366 b.setAttribute('disabled', 'disabled');
367 }

107. !,+,4,1!5/--*$(?M3,(Q,+,T
!-3804,1!51"*/%*',*:*$%Q!(*7(4,T/
!,+,4,1!50*%W%%"349%*Q(!!)9/2(+0,T

108. ?/01/(3$5)@%2,*)@M**%0

109. 370 var nodes = document.getElementsByTagName('p');
371 for (var i = 0; i < nodes.length; i++) {
372 nodes[i].style.display = 'none';
373 }

110. !7$)?@@K
!:/"53$&,*O%K)V-D
!7$)=/+/01"3-%
!*,*:*$%;0%2,*;:/"53$B*O%)l)gV-Dgh

111. 24 .dark{
25 color: #333;
26 }
27 .highlight{
28 color: red;
29 }
376 node.className = 'dark';

112. @9::/"3L*
![EA)%"**
!8"/+*"03$5)',*:*$%0
!!3$(3$5)',*:*$%0
!A#(3O2)',*:*$%0
!?/01/(3$5)@%2,*)@M**%0

113. '+*$%

114. '+*$%)%2-*
! A#90*)'+*$%
! 1,31I>:#90*(#H$);;;
! I*24#/"()'+*$%
! I*2(#H$>I*29-);;;
! C/5*>',*:*$%)'+*$%
! ,#/(>9$,#/();;;
! #$4,9">#$094:3%);;;

115. '+*$%)6/$(,3$5

116. W0)C"#-*"%3*0
32 <input type="button" onclick="toggleHighlight(this)"
value="click me!"/>
378 function toggleHighlight(element) {
379 if (element.className == 'highlight') {
380 element.className = 'dark';
381 }else {
382 element.className = 'highlight';
383 }
384 }

117. W0)W%%"349%*0
387 document.body.onclick = function(e) {
388 e = window.event || e;
389 toggleHighlight(e.target || e.srcElement);
390 };

118. e*530%"/%3#$
393 function bindEvent(element, type, listener) {
394 if (element.addEventListener) {
395 element.addEventListener(type, listener, false);
396 } else if (element.attachEvent) {
397 element.attachEvent('on' + type, listener);
398 }
399 }
400
401 bindEvent(document.body, 'click', function(e) {
402 e = window.event || e;
403 toggleHighlight(e.target || e.srcElement);
404 });

119. '+*$%)C"#-/5/%3#$

120. 408 bindEvent(document.body, 'click', function(e) {
409 e = window.event || e;
410 toggleHighlight(e.target || e.srcElement);
411 });
412
413 bindEvent(document.getElementById('my-id'), 'click', function(e) {
414 e = window.event || e;
415 stopPropagation(e);
416 });
417
418
419 stopPropagation = function(event) {
420 if (event.stopPropagation) {
421 event.stopPropagation();
422 } else {
423 event.cancelBubble = true;
424 }
425 };

121. E%M*")O*/%9"*0

122. 83:*"

123. 431 setTimeout(function() {
432 alert(1);
433 }, 1000);
434
435 var count = 1;
436 var timer = setInterval(function() {
437 if (count == 10) {
438 clearTimeout(timer);
439 }
440 document.body.innerHTML += 'Adding<br />';
441 count++;
442
443 }, 1000);

124. setTimeout(fn, 0);

125. ?#(*)30$f%)3$+#I*()"35M%)/H/2)
49%)30)"9$)g/0)0##$)/0)-#0034,*;g

126. ?##I3*0

127. W)833:#,)30)/)0:/,,)/:#9$%)#O)$/:*()
(/%/)0%#"*()42)%M*)H*4)4"#H0*"

128. 446 document.cookie = 'username=berg';
447
448 var nextYear = new Date();
449 nextYear.setFullYear(nextYear.getFullYear() + 1);
450 document.cookie = 'username=berg; expires=' +
nextYear.toGMTString();

129. 452 function getCookie(key) {
453 var reg = new RegExp('(^| )' + key + '=([^;]*)(;|x24)'),
454 result = reg.exec(document.cookie);
455
456 if (result) {
457 return result[2] || null;
458 }
459
460 return null;
461 }
462 getCookie('username');

130. Advanced scripting

131. ?#::9$31/%*)H3%M)/)H*4)0*"+*")H3%M#9%)
1/903$5)%M*)H*4)4"#H0*")"*,#/(

132. !WG/D
!mAB6%%-e*n9*0%)#")W1%3+*mE4G*1%
!F"#H0*)M30%#"2)1#$%"#,
!C/5*)"*$(*"

133. @*"+*"&03(*)=/+/01"3-%

134. 466 var http = require('http');
467 http.createServer(function(req, res) {
468 res.writeHead(200, {'Content-Type': 'text/plain'});
469 res.end('Hello Worldn');
470 }).listen(1337, '127.0.0.1');
471 console.log('Server running at http://127.0.0.1:1337/');

135. 68ABo)O*/%9"*0

136. e*O*"*$1*)&)4##I0
!=/+/@1"3-%K)8M*)[*]$3%3+*)d93(*)&)
[/+3()!,/$/5/$
!!"#"$%&'()*+,-.+/001+2"&)$+3+40567"$+
8&0%9:0&1
!C"#)=/+/01"3-%)[*035$)C/%%*"$0)&)e#00)
6/":*0.)[90%3$)[3/L
!--I)#$)=/+/01"3-%)&)C*%*"&C/9,)p#1M

137. e*O*"*$1*)&)H*403%*0
!;5'&9$<01.*+-))(*==
>>>?@5'&9$A01.?0&6=
!=/+/01"3-%)1,#09"*0K)M%%-K>>G344*"3$5;1#:>
O/n>$#%*0>1,#09"*0>
!!3"0%&1,/00)O9$1%3#$K)M%%-K>>
*$;H3I3-*(3/;#"5>H3I3>!3"0%&1,/00qO9$1%3#$

138. QA

139. !anks

140. 8M*)(*035$)U)/"1M3%*1%9"*)#O)
8/$5"/:
=/+/01"3-%)4/031P
Javascript basic+
berg

141. ?

142. A library is like a toolkit

147. 0.5s
delay

149. 20%

151. Changing Every Day

153. • Prototype
• jQuery
• mootools
• sencha (EXT)

154. •
•
•
•

156. Tangram

157. [ˈtæŋɡrəm]
Tang
Gram

158. [ˈtæŋɡrəm]
Tang
Gram

159. M%%-K>>%/$5"/:;4/3(9;1#:

160. button
plugin Mobile
dialog
fx behaviors
other
menubar
base ...
Editor
UI Component
extra DOM event ajax ...
core
Base

161. tangram base

162. •
•
•
•

163. •
•
•

164. •
•

165. •
•
•

166. core
extra

167. codesearch
• http://fe/stable/tangram/codesearch.html
•
•
• url

168. CDN
!r01"3-%)%2-*lg%*D%>G/+/01"3-%g)0"1lgM%%-K>>
3:5;4/3(9;1#:>G0>%/$5"/:&4/0*&
1#"*&V;^;Y;G0gsr>01"3-%s
!r01"3-%)%2-*lg%*D%>G/+/01"3-%g)0"1lgM%%-K>>
3:5;4/3(9;1#:>G0>%/$5"/:&4/0*&V;^;Y;G0gsr>
01"3-%s

169. DOM
•
•
•
•
• ready

170. Event
on once
un
get
fire

171. browser
•
• isSome

172. • array
• object • url
• number • swf
• date • cookie
• string • json
• trim/format

173. ajax
get
post
request
form

174. lang
Class inherits
Event module
isXXX

175. lang
dispatchEvent instance
addEventListener decontrol
removeEventListener
guid

176. getScrollLeft
page
getScrollTop
createStyleSheet
getViewHeight
getMousePosition
getViewWidth
loadJsFile
getWidth
loadCssFile
getHeight

177. ?/01/(*
231 T.e('#header').
232 children().
233 on('click', function() {
234 alert('clicked');
235 });

178. tangram UI

179. •
•
•

180. •
•
•

181. •
• DOM
•
•

182. constructor
...
...
prototype
...

184. constructor
prototype

185. constructor
addon constructor
prototype
addon prototype

186. ui.some.create({ });
ui.some.options = { };
ui.Some.extend({ });

188. UIBase

189. UIBase
button dialog table ...

190. UIBase
button dialog table ...
alert
confirm
modal
keyboard
...

191. UIBase
button dialog table ...
alert
draggable
confirm
stateable modal
keyboard
...
...

192. ui ui
dialog tab
button carsourel suggestion
draggable
popup tooltip table
droppable
input progressbar accordion
stateable
itemset pager menubar
decorator
modal combox starRate
posable
datepicker slider
ColorPalette Login

193. tangram mobile (beta)

194. •
•
•

195. •
• 2K
•
•
• UI

196. F9%%#$ C/5* 8/4
?/"0#9"*, C#-9- 8##,4/"
W((#$0
B30%`3*H @1"#,,*" `3(*#
A/0I @,3(*"
<74/0* <7
194*
"#%/%* (4%/- %/-
O/(*
01/,* -3$1M %/-6#,(
u3-
0,3(* 0H3-* %9"$
-#- !D '+*$%
F/0*
tF/0*

199. Tangram

200. mp3
IM
Tangram
hao123

201. Tangram
http://github.com/BaiduFE

202. QA

203. Thanks!
berg