zoukankan      html  css  js  c++  java
  • jquery 表格练习

    <!DOCTYPE html>


    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="jquery-1.7.1.min.js"></script>
        <script>
            var list=[{'id':'1','国家':'中国','首都':'北京'},{'id':'2','国家':'美国','首都':'华盛顿'},{'id':'3','国家':'日本','首都':'东京'}]
            $(function () {
                var oldColor;
                $.each(list, function (index, content) {
                    var tr = $('<tr></tr>').appendTo('tbody');
                    tr.hover(function () {
                        oldColor = $(this).css('background-color');
                        $(this).css({ 'background-color': 'red', 'cursor': 'pointer' });
                    }, function () {
                        $(this).css('background-color', oldColor);
                    });
                    $.each(content, function (key, value) {
                        $('<td>' + value + '</td>').appendTo(tr);
                    });
                });


                $('tbody tr:even').css('background-color', 'yellow');
            });
        </script>
    </head>
    <body>
        <table border="1">
            <thead>
               <tr>
                <th>Id</th>
                <th>国家</th>
                <th>首都</th>
            </tr>
            </thead>
            
            <tbody>


            </tbody>
        </table>
    </body>
    </html>
  • 相关阅读:
    css盒子模型、垂直外边距合并
    mov指令和 add以及sub 指令的区别
    第一章 基础知识
    字符串文档的去重
    python 之 字符串的常用方法
    python格式化输出之format用法
    python 格式化输出之%号
    c++11可变参数模板的使用1
    深入浅出 c++11 std::async
    std::thread 概述
  • 原文地址:https://www.cnblogs.com/dxmfans/p/9434701.html
Copyright © 2011-2022 走看看