zoukankan      html  css  js  c++  java
  • JS控制table中tr位置互换

    <script type="text/javascript">
        function doit(f, t) {
            $("#tbl tr:nth-child(" + f + ")").insertAfter($("#tbl tr:nth-child(" + t + ")"));
        }
    </script>
    <table id="tbl">
        <tr><td>1</td></tr>
        <tr><td>2</td></tr>
        <tr><td>3</td></tr>
        <tr><td>4</td></tr>
    </table>
    <input type="button" onclick="doit(1, 3);" value="click">

     其中:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型。

    例如:

    p:nth-child(2)
    {
    background:#ff0000;
    }

    即p元素是其父元素,表示页面中其父元素p的第二个子元素的背景色为#ff0000;

    w3school例子:

    <!DOCTYPE html>
    <html>
    <head>
    <style> 
    p:nth-child(odd)
    {
    background:#ff0000;
    }
    p:nth-child(even)
    {
    background:#0000ff;
    }
    </style>
    </head>
    <body>
    
    <h1>这是标题</h1>
    <p>第一个段落。</p>
    <p>第二个段落。</p>
    <p>第三个段落。</p>
    <p>第四个段落。</p>
    
    <p><b>注释:</b>Internet Explorer 不支持 :nth-child() 选择器。</p>
    
    </body>
    </html>

    :odd 选择器 选取每个带有奇数 index 值的元素(比如 1、3、5)。

    index 值从 0 开始,所有第一个元素是偶数 (0)。

    最常见的用法:与其他元素/选择器一起使用,来选择指定的组中奇数序号的元素(如上面的例子)。

    :even 选择器 选取每个带有偶数 index 值的元素(比如 2、4、6)。

    index 值从 0 开始,所有第一个元素是偶数 (0)。

    最常见的用法:与其他元素/选择器一起使用,来选择指定的组中偶数序号的元素.如

    选择每个相隔的(偶数) <tr> 元素:

    $("tr:even")
  • 相关阅读:
    LINUX 环境变量总结
    make的自动变量和预定义变量
    函数调用约定和堆栈
    如何查看linux命令源代码
    shell脚本中特定符合变量的含义
    【转载】Redhat5和6 YUM源配置的区别
    用路径分析法来编写测试用例
    linux ip 设置
    Mysql 的存储引擎,myisam和innodb的区别。
    一些编译php时的configure 参数
  • 原文地址:https://www.cnblogs.com/EleMMent/p/4130758.html
Copyright © 2011-2022 走看看