getElementsByClassName-20.htm (2362B)
1 <!DOCTYPE html> 2 <html><head> 3 <title>getElementsByClassName</title> 4 <meta content="get elements in document then add element to collection" name="description"> 5 <link href="https://dom.spec.whatwg.org/#dom-document-getelementsbyclassname" rel="help"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 </head> 9 <body> 10 <div id="log"></div> 11 <div> 12 <div> 13 <a class="text link" href="#foo">test link #foo</a> 14 </div> 15 <b class="text">text</b> 16 </div> 17 <table> 18 <caption class="text caption">text caption</caption> 19 <thead> 20 <tr> 21 <td class="TEXT head">TEXT head</td> 22 </tr> 23 </thead> 24 <tbody> 25 <tr> 26 <td class="td text1">td text1</td> 27 </tr> 28 <tr> 29 <td class="td text">td text</td> 30 </tr> 31 <tr> 32 <td class="td te xt">td te xt</td> 33 </tr> 34 </tbody> 35 <tfoot> 36 <tr> 37 <td class="TEXT foot">TEXT foot</td> 38 </tr> 39 </tfoot> 40 </table> 41 <div class="xt te">xt te</div> 42 43 <script type="text/javascript"> 44 test(function() 45 { 46 var collection = document.getElementsByClassName("text"); 47 assert_equals(collection.length, 4); 48 var newDiv = document.createElement("div"); 49 newDiv.setAttribute("class", "text"); 50 newDiv.innerHTML = "text newDiv"; 51 document.getElementsByTagName("table")[0].tBodies[0].rows[0].cells[0].appendChild(newDiv); 52 53 assert_equals(collection.length, 5); 54 assert_equals(collection[0].parentNode.nodeName, "DIV"); 55 assert_equals(collection[1].parentNode.nodeName, "DIV"); 56 assert_equals(collection[2].parentNode.nodeName, "TABLE"); 57 assert_equals(collection[3].parentNode.nodeName, "TD"); 58 assert_equals(collection[4].parentNode.nodeName, "TR"); 59 }, "get elements in document then add element to collection"); 60 </script> 61 </body></html>