页面加载自动排列DIV顺序

最新推荐文章于 2024-11-04 16:08:47 发布

design8988

最新推荐文章于 2024-11-04 16:08:47 发布

阅读量156

点赞数

文章标签： xhtml

原文链接：http://www.cnblogs.com/lxu220/archive/2012/03/18/2404667.html

版权

效果说明：当页面加载或刷新时，自动重新排列指定的DIV ID顺序

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
</head>
<body>
<div id="c4">4</div>
<div id="c2">2</div>
<div id="c1">1</div>
<div id="c3">3</div>
<input type="button" value="4,2,3,1" onclick="sortDiv(4,2,3,1)" />
<input type="button" value="2,4,3,1" onclick="sortDiv(2,4,3,1)" />
<input type="button" value="1,2,3,4" onclick="sortDiv(1,2,3,4)" />
<script>
var $ = function(id){return document.getElementById(id)}
function sortDiv(){
var s = document.createDocumentFragment()
for(var i=0;i<arguments.length;i++)
          {s.appendChild($('c'+arguments[i]));}
          document.body.insertBefore(s,document.getElementsByTagName('input')[0])
}
window.onload=sortDiv(1,2,3,4);

</script>
</body>
</html>