网络编程
位置：首页>> 网络编程>> JavaScript>> js将table的每个td的内容自动赋值给其title属性的方法

js将table的每个td的内容自动赋值给其title属性的方法

作者：jingxian　　发布时间：2023-08-07 18:34:54　

标签：js,table,td,赋值

如下所示：


<!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>
<title>将table的每个td的内容自动赋值给其title属性</title>
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<style type="text/css">
.tbStyle td{
 border:1px solid #F00
}
.tbStyle th{
 border:1px solid #F00
}
</style>
<script src="jquery-1.10.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
 //table的最后一列不给其title赋值
 var cellIndex=parseInt($(".tbStyle th").length)-1;
 $(".tbStyle tr td").each(function(){
   if(this.cellIndex != cellIndex){
     $(this).attr("title",$(this).text());
     //alert($(this).parent().get(0).rowIndex);输出所在行
    }
 });
});
</script>
</head>
<body>
 <table class="tbStyle">
   <tr>
     <th>第一列</th>
     <th>第二列</th>
     <th>第三列</th>
     <th>第四列</th>
   </tr>
   <tr>
     <td>aaaaaaa</td>
     <td>bbbbbbb</td>
     <td>ccccccc</td>
     <td>ddddddd</td>
   </tr>
   <tr>
     <td>eeeeeee</td>
     <td>fffffff</td>
     <td>ggggggg</td>
     <td>hhhhhhh</td>
   </tr>
   <tr>
     <td>iiiiiii</td>
     <td>jjjjjjj</td>
     <td>kkkkkkk</td>
     <td>lllllll</td>
   </tr>
 </table>
</body>
</html>
0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com