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


Posted in Javascript onOctober 13, 2016

如下所示:

<!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>

以上就是小编为大家带来的js将table的每个td的内容自动赋值给其title属性的方法全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
JS实多级联动下拉菜单类,简单实现省市区联动菜单!
May 03 Javascript
JS 判断代码全收集
Apr 28 Javascript
jQuery 数据缓存data(name, value)详解及实现
Jan 04 Javascript
javascript中有趣的反柯里化深入分析
Dec 05 Javascript
JQuery获取或设置ckeditor的数据(示例代码)
Nov 15 Javascript
JavaScript直播评论发弹幕切图功能点集合效果代码
Jun 26 Javascript
jQuery实现页面下拉100像素出现悬浮窗口的方法
Sep 05 Javascript
MUI 解决动态列表页图片懒加载再次加载不成功的bug问题
Apr 13 Javascript
微信小程序录音与播放录音功能
Dec 25 Javascript
微信小程序自定义toast组件的方法详解【含动画】
May 11 Javascript
layer弹出层取消遮罩的方法
Sep 25 Javascript
ESLint 是如何检查 .vue 文件的
Nov 30 Vue.js
jquery获取点击控件的绝对位置简单实例
Oct 13 #Javascript
Bootstrap幻灯片轮播图支持触屏左右手势滑动的实现方法
Oct 13 #Javascript
Node.js中常规的文件操作总结
Oct 13 #Javascript
BootStrap实现手机端轮播图左右滑动事件
Oct 13 #Javascript
js图片切换具体实现代码
Oct 13 #Javascript
微信小程序 rpx 尺寸单位详细介绍
Oct 13 #Javascript
jquery实现图片切换代码
Oct 13 #Javascript
You might like
php购物车实现代码
2011/10/10 PHP
PHPMailer使用教程(PHPMailer发送邮件实例分析)
2012/12/06 PHP
php计算函数执行时间的方法
2015/03/20 PHP
PHP实现微信小程序人脸识别刷脸登录功能
2018/05/24 PHP
Extjs中通过Tree加载右侧TabPanel具体实现
2013/05/05 Javascript
jQuery实现的导航动画效果(附demo源码)
2016/04/01 Javascript
设计模式中的facade外观模式在JavaScript开发中的运用
2016/05/18 Javascript
微信小程序  modal弹框组件详解
2016/10/27 Javascript
xcode中获取js文件的路径方法(推荐)
2016/11/05 Javascript
简单实现js进度条加载效果
2020/03/25 Javascript
vue的一个分页组件的示例代码
2017/12/25 Javascript
AngularJS使用Filter自定义过滤器控制ng-repeat去除重复功能示例
2018/04/21 Javascript
解决vue-cli 打包后自定义动画未执行的问题
2019/11/12 Javascript
使用python分析git log日志示例
2014/02/27 Python
分享15个最受欢迎的Python开源框架
2014/07/13 Python
python在windows命令行下输出彩色文字的方法
2015/03/19 Python
python统计字符串中指定字符出现次数的方法
2015/04/04 Python
VSCode下好用的Python插件及配置
2018/04/06 Python
Python设计模式之状态模式原理与用法详解
2019/01/15 Python
使用python3构建文件传输的方法
2019/02/13 Python
python基于socket进行端口转发实现后门隐藏的示例
2019/07/25 Python
python 常用日期处理-- datetime 模块的使用
2020/09/02 Python
html5+css3之CSS中的布局与Header的实现
2014/11/21 HTML / CSS
JD Sports澳洲官网:英国领先的运动鞋和运动时尚零售商
2020/02/15 全球购物
关于爱情的广播稿
2014/01/16 职场文书
文秘人员工作职责
2014/01/31 职场文书
职工趣味运动会方案
2014/02/10 职场文书
创建市级文明单位实施方案
2014/03/01 职场文书
生育关怀行动实施方案
2014/03/26 职场文书
化验室岗位职责
2015/02/14 职场文书
2015年秋季小学开学典礼主持词
2015/07/16 职场文书
商务英语邮件开头问候语
2015/11/10 职场文书
2016年学习雷锋精神广播稿
2015/12/17 职场文书
甜美蛋糕店的创业计划书模板,拿来即用!
2019/08/21 职场文书
Python基于Opencv识别两张相似图片
2021/04/25 Python
golang http使用踩过的坑与填坑指南
2021/04/27 Golang