JavaScript动态向ul中插入100个li节点,5秒后实现元素的倒排
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script> //用JS为id为test的ul下动态创建100个li节点,1秒后将这100个节点实现倒排(节点处理,非innerHTML) window.onload = function(){ var ul = document.getElementById("test"); for(var i=0;i<100;i++){ var li = document.createElement("li"); var content = document.createTextNode(i); li.appendChild(content); ul.appendChild(li); } // document.write(ul.firstChild); setTimeout(function(){ var temp=ul.removeChild(ul.lastChild); //ul.appendChild(temp); ul.insertBefore(temp,ul.firstChild); for(var j=0;j<99;j++){ var temp2=ul.removeChild(ul.lastChild); ul.insertBefore(temp2,ul.childNodes[j+2]); } },5000); } </script> </head> <body> <ul id="test"> </ul> </body> </html>