| 1 | <!DOCTYPE html> |
|---|
| 2 | <html> |
|---|
| 3 | <head> |
|---|
| 4 | <title>Opera HTML5 and JS getElementsByTagName test...</title> |
|---|
| 5 | <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> |
|---|
| 6 | <meta http-equiv="content-language" content="en-US" /> |
|---|
| 7 | </head> |
|---|
| 8 | <body> |
|---|
| 9 | <nav id="nav"> |
|---|
| 10 | <ul> |
|---|
| 11 | <li><a href="#content">Home</a></li> |
|---|
| 12 | <li><a href="#portfolio">Portfolio</a></li> |
|---|
| 13 | <li><a href="#about">About</a></li> |
|---|
| 14 | <li><a href="#contact">Contact</a></li> |
|---|
| 15 | <li><br style="clear: both" /></li> |
|---|
| 16 | </ul> |
|---|
| 17 | </nav> |
|---|
| 18 | |
|---|
| 19 | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js" type="text/javascript" charset="utf-8"></script> |
|---|
| 20 | <script type="text/javascript" charset="utf-8"> |
|---|
| 21 | $('#nav > ul > li').css('background', '#0f0'); // green |
|---|
| 22 | document.getElementsByTagName('nav')[0].getElementsByTagName('ul')[0].getElementsByTagName('li')[0].style.background = "#0ff"; //teal? |
|---|
| 23 | $('nav > ul > li').css('background', '#f00'); //red |
|---|
| 24 | |
|---|
| 25 | $('nav').append("<h1>" + $('nav').length + "</h1>") |
|---|
| 26 | $('nav').append("<h1>" + $('nav > ul').length + "</h1>") |
|---|
| 27 | </script> |
|---|
| 28 | </body> |
|---|
| 29 | </html> |
|---|
