zoukankan      html  css  js  c++  java
  • 【js】将table的每个td的内容自动赋值给其title属性

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4 <title>将table的每个td的内容自动赋值给其title属性</title>
     5 <meta http-equiv="content-type" content="text/html;charset=UTF-8">
     6 <style type="text/css">
     7 .tbStyle td{
     8     border:1px solid #F00
     9 }
    10 .tbStyle th{
    11     border:1px solid #F00
    12 }
    13 </style>
    14 <script src="jquery-1.10.2.js" type="text/javascript"></script>
    15 <script type="text/javascript">
    16 $(function(){
    17     //table的最后一列不给其title赋值
    18    var cellIndex=parseInt($(".tbStyle th").length)-1;
    19    $(".tbStyle tr td").each(function(){
    20         if(this.cellIndex != cellIndex){
    21             $(this).attr("title",$(this).text());
    22             //alert($(this).parent().get(0).rowIndex);输出所在行
    23           }
    24    });
    25 });
    26 </script>
    27 </head>
    28 <body>
    29     <table class="tbStyle">
    30         <tr>
    31             <th>第一列</th>
    32             <th>第二列</th>
    33             <th>第三列</th>
    34             <th>第四列</th>
    35         </tr>
    36         <tr>
    37             <td>aaaaaaa</td>
    38             <td>bbbbbbb</td>
    39             <td>ccccccc</td>
    40             <td>ddddddd</td>
    41         </tr>
    42         <tr>
    43             <td>eeeeeee</td>
    44             <td>fffffff</td>
    45             <td>ggggggg</td>
    46             <td>hhhhhhh</td>
    47         </tr>
    48         <tr>
    49             <td>iiiiiii</td>
    50             <td>jjjjjjj</td>
    51             <td>kkkkkkk</td>
    52             <td>lllllll</td>
    53         </tr>
    54     </table>
    55 </body>
    56 </html>
  • 相关阅读:
    查询数据库表的列字段、字段类型、字段长度、是否为空
    AndroidManifest.xml配置文件详解(转载)
    SQL Server Profiler(转载)
    sql 临时表
    sql 全局查询
    react.js
    middleware
    el
    jade模板使用心得
    jade template
  • 原文地址:https://www.cnblogs.com/ningvsban/p/3681682.html
Copyright © 2011-2022 走看看