<!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=gb2312" />
<title>无标题文档</title>
</head><body>
<script type="text/javascript">
function $(id){
return document.getElementById(id);
}
function swap(){
var pNode1, pNode2;
pNode1 = $("div1").parentNode;
pNode2 = $("div2").parentNode;
pNode1.appendChild($("div2"));
pNode2.appendChild($("div1"));
}
</script>
<table >
<tr><td>
<div id="div1">视频1</div>
</td><td>
<div id="div2">视频2</div>
</td></tr>
</table>
<input type="button" name="btn" id="btn" value="交换" onclick="swap()" />
</body>
</html>

解决方案 »

  1.   

     <div>
            <input type="button" onclick="changePos()" value="Change Position" />
            <div id="div1" style="position: absolute; z-index: 800; width: 250px; height: 200px;
                background-color: Blue; top: 117px; left: 90px;">
            </div>
            <div id="div2" style="position: absolute; z-index: 900; width: 250px; height: 200px;
                background-color: Gray; top: 133px; left: 113px;">
            </div>
        </div>    <script language="javascript" type="text/javascript">
        function changePos()
        {
        var d1=document.getElementById('div1');
        var d2=document.getElementById('div2');
        
        var temp=d1.style.zIndex;
        d1.style.zIndex=d2.style.zIndex;
        d2.style.zIndex=temp;
        
        }
        </script>