|
1 <!DOCTYPE html> |
|
2 <html> |
|
3 <!-- Any copyright is dedicated to the Public Domain. |
|
4 http://creativecommons.org/publicdomain/zero/1.0/ --> |
|
5 <head> |
|
6 <meta charset="utf-8"> |
|
7 <title>Resources</title> |
|
8 <script type="text/javascript" id="script1"> |
|
9 window.addEventListener('load', function() { |
|
10 var pid = document.getElementById('pid'); |
|
11 var div = document.createElement('div'); |
|
12 div.id = 'divid'; |
|
13 div.classList.add('divclass'); |
|
14 div.appendChild(document.createTextNode('div')); |
|
15 div.setAttribute('data-a1', 'div'); |
|
16 pid.parentNode.appendChild(div); |
|
17 }); |
|
18 </script> |
|
19 <script src="resources_inpage.jsi"></script> |
|
20 <link rel="stylesheet" type="text/css" href="resources_inpage1.css"/> |
|
21 <link rel="stylesheet" type="text/css" href="resources_inpage2.css"/> |
|
22 <style type="text/css"> |
|
23 p { color: #800; } |
|
24 div { color: #008; } |
|
25 h4 { color: #080; } |
|
26 h3 { color: #880; } |
|
27 </style> |
|
28 </head> |
|
29 <body> |
|
30 <style type="text/css" id=style2> |
|
31 .pclass { background-color: #FEE; } |
|
32 .divclass { background-color: #EEF; } |
|
33 .h4class { background-color: #EFE; } |
|
34 .h3class { background-color: #FFE; } |
|
35 </style> |
|
36 |
|
37 <p class="pclass" id="pid" data-a1="p">paragraph</p> |
|
38 |
|
39 <script> |
|
40 var pid = document.getElementById('pid'); |
|
41 var h4 = document.createElement('h4'); |
|
42 h4.id = 'h4id'; |
|
43 h4.classList.add('h4class'); |
|
44 h4.appendChild(document.createTextNode('h4')); |
|
45 h4.setAttribute('data-a1', 'h4'); |
|
46 pid.parentNode.appendChild(h4); |
|
47 </script> |
|
48 |
|
49 </body> |
|
50 </html> |