Vanilla-js/index.html at master · madmanlear/Vanilla-js · GitHub

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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<!DOCTYPE html>
<!--[if lt IE 7]><html class="no-js ie6 oldie" lang="en"><![endif]-->
<!--[if IE 7]><html class="no-js ie7 oldie" lang="en"><![endif]-->
<!--[if IE 8]><html class="no-js ie8 oldie" lang="en"><![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"><!--<![endif]-->
<head>
	<meta charset="UTF-8">
	<title></title>
	<script src="vanilla.js"></script>
	<script>
	  //JSONP Test callback
    function formatCurrency(data) {
    	console.log(data);
    }

    //Doc Ready
    nilla.docReady(function() {
    	var a = nilla.create('a', {
    		'href': '#',
    		'html': 'click me'
    	});
    	var p = nilla.create('p', {
    		'id': 'test',
    		'class': 'red',
    		'html': '<strong>here we go!</strong> <em>woot</em>.'
    	});
    	p.appendChild(a);
    	document.body.appendChild(p);
    	nilla.each('ul li', function(el) {
    		console.log(el);
    	});
    	nilla.bind('ul li', 'click', function(e) {
    		console.log(nilla.text(e.srcElement));
    	});
    	var lis = nilla.lastOfType('ul', 'li');
    	nilla.each(lis, function(li) {
    		nilla.attrs(li, {style: 'color:red'});
    	});
    	nilla.load('http://openexchangerates.org/latest.json?callback=formatCurrency');
    });
	</script>
</head>
<body>
  <div id="header">
    <h1>Vanilla</h1>
    <ul>
      <li>One</li>
      <li>Two</li>
      <li>Three</li>
    </ul>
    <ul>
      <li>Four</li>
      <li>Five</li>
      <li>Six</li>
    </ul>
  </div>
</body>
</html>