Cross Reference: /yui3/src/node/docs/dom-node.mustache
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<link href="{{componentAssets}}/node.css" rel="stylesheet" type="text/css">
<div class="intro">
<p>Click any of the blue boxes to copy to the other stack.</p>
<p>Click a box in the other stack to remove it completely.</p>
</div>
<div class="example">
{{>dom-node-source}}
</div>
<h2>Setting up the HTML</h2>
<p>First we need some HTML to work with.</p>
```
<ul id="demo">
<li>lorem</li>
<li>ipsum</li>
<li>dolor</li>
<li>sit</li>
</ul>
<ul id="demo2">
<li>foo</li>
<li>bar</li>
</ul>
```
<h2>Using DOM Methods</h2>
<p>Most common DOM methods are available via Node instances. These can be used to add, remove, and retrieve other nodes.</p>
```
clone = item.cloneNode(true);
list2.append(clone);
item.remove(); // sugar for item.get('parentNode').removeChild(item);
```
<h2>Complete Example Source</h2>
```
{{>dom-node-source}}
```