1. 爱易网页
  2. HTML教程
  3. JS控制HTMLDOM表格行下上移动

JS控制HTMLDOM表格行下上移动

日期：2014-05-17　 浏览次数：20734 次

JS控制HTMLDOM表格行上下移动
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>JS控制HTMLDOM表格行上下移动</title>
<style type="text/css">
<!--
td  { text-align:center;font-size:12px;padding:3px;}

www.111cn.cn
-->
</style>
</head>
<body>
<table id="table1" bordercolor="#000000" width="200" border="1">
    <tbody>
        <tr>
            <td width="25%">1</td>
            <td width="25%">11</td>
   <!--使用javascript:void(0)是为了能够传递this参数到事件处理程序-->
            <td width="25%"><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td width="25%"><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>2</td>
            <td>22</td>
            <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>3</td>
            <td>33</td>
            <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>4</td>
            <td>44</td>
            <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>5</td>
            <td>55</td>
            <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
    </tbody>
</table>
</body>
</html>

<script language="JavaScript" type="text/javascript">

相关资料更多>

  1. CSS兑现跨浏览器兼容性的盒阴影效果
  2. td内文字格式有关问题
  3. 为什么IE和FF对CSS float属性的理解很不一样？解决方法
  4. 网页背景自动大小,该怎么解决
  5. 网站亲和力评价
  6. Firefox下td高度显示有关问题
  7. 让IE9以次的版本兼容HTML5解决方案
  8. 用IE浏览器打开CSDN的主页为什么总是显示不全
  9. 不同浏览器对于css的兼容有关问题