Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(90)

Side by Side Diff: recipes/web/html/inserting_elements.html

Issue 14109034: Recipes for using CSS Selectors with dart:html (Closed) Base URL: https://github.com/dart-lang/cookbook.git@master
Patch Set: Changes based on Kathy's comments. Created 7 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <!DOCTYPE html>
2
3 <html>
4 <body>
5 <ol>
6 <li>One</li>
7 <li>Two</li>
8 </ol>
9
10 <script type="application/dart">
11
12 import 'dart:html';
13
14 void main() {
15
16 var ol = query('ol');
17 ol.insertAdjacentHtml('beforeBegin', '<p>Starting the ol</p>');
18 ol.insertAdjacentHtml('afterEnd', '<p>Done with the ol</p>');
19
20
21 UListElement ul = new Element.tag('ul');
22
23 // Append using element.append()
24 ul.append(new Element.html('<li>One</li>'));
25
26 // Append using element.appendHtml()
27 ul.appendHtml('<li>Two</li>');
28
29 // Append using List#add()
30 ul.children.add(new Element.html('<li>Three</li>'));
31
32 // Append using List#addAll()
33 ul.children.addAll([
34 new Element.html('<li>Four</li>'),
35 new Element.html('<li>Five</li>')
36 ]);
37
38 // Inserting in the middle
39 ul.children.insert(1, new Element.html('<li>One And A Half</li>'));
40
41 // Prepending using list method.
42 ul.children.insert(0, new Element.html('<li>Zero</li>'));
43 // Less good.
44 ul.insertAdjacentHtml('afterBegin', '<li>Less than Zero</li>');
45
46 // Append using insertAdjacentHtml()
47 ul.insertAdjacentHtml('beforeEnd', '<li>Last</li>');
48
49 // Don't work.
50 ul.insertAdjacentHtml('beforeBegin', '<div>Before the UL</div>');
51 ul.insertAdjacentHtml('afterEnd', '<div>After the UL</div>');
52
53 document.body.children.add(ul);
54
55 document.body.insertAdjacentHtml('afterBegin', '<p>Starting the body</p> ');
56 document.body.insertAdjacentHtml('beforeEnd', '<p>Ending the body</p>') ;
57
58 // insertBefore() // prepend
59 // insertAllBefore() // prepend several
60 }
61 </script>
62
63 <script src="packages/browser/dart.js"></script>
64 </body>
65 </html>
OLDNEW
« no previous file with comments | « recipes/web/html/creating_elements.html ('k') | recipes/web/html/inserting_elements_outside.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698