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 相关文章推荐
关于jquery ajax 调用带参数的webservice返回XML数据一个小细节
Jul 31 Javascript
jquery.validate的使用说明介绍
Nov 12 Javascript
jquery简单实现鼠标经过导航条改变背景图
Dec 17 Javascript
js定时器的使用(实例讲解)
Jan 06 Javascript
validationEngine 表单验证插件使用实例代码
Jun 15 Javascript
JS实现导出Excel的五种方法详解【附源码下载】
Mar 15 Javascript
vue中引入mxGraph的步骤详解
May 17 Javascript
jQuery实现简单飞机大战
Jul 05 jQuery
openlayers4实现点动态扩散
Aug 17 Javascript
.netcore+vue 实现压缩文件下载功能
Sep 24 Javascript
jquery实现拖拽添加元素功能
Dec 01 jQuery
typescript编写微信小程序创建项目的方法
Jan 29 Javascript
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
如何删除多级目录
2006/10/09 PHP
Yii2实现让关联字段支持搜索功能的方法
2016/08/10 PHP
Laravel框架学习笔记之批量更新数据功能
2019/05/30 PHP
JavaScript Title、alt提示(Tips)实现源码解读
2010/12/12 Javascript
利用js(jquery)操作Cookie的方法说明
2013/12/19 Javascript
jQuery实现简单网页遮罩层/弹出层效果兼容IE6、IE7
2014/06/16 Javascript
js实现div闪烁原理及实现代码
2014/06/24 Javascript
jquery实现选中单选按钮下拉伸缩效果
2015/08/06 Javascript
javascript字符串替换函数如何一次性全部替换掉
2015/10/30 Javascript
每天一篇javascript学习小结(Function对象)
2015/11/16 Javascript
jQuery实现的网页换肤效果示例
2016/09/20 Javascript
easyui tree带checkbox实现单选的简单实例
2016/11/07 Javascript
完美解决jQuery 鼠标快速滑过后,会执行多次滑出的问题
2016/12/08 Javascript
Async Validator 异步验证使用说明
2017/07/03 Javascript
angular.extend方法的具体使用
2017/09/14 Javascript
基于js中this和event 的区别(详解)
2017/10/24 Javascript
5 种JavaScript编码规范
2018/01/30 Javascript
Vue项目中如何引入icon图标
2018/03/28 Javascript
微信小程序录音实现功能并上传(使用node解析接收)
2020/02/26 Javascript
Python实现的简单发送邮件脚本分享
2014/11/07 Python
使用python对文件中的单词进行提取的方法示例
2018/12/21 Python
Python正则表达式实现简易计算器功能示例
2019/05/07 Python
python使用gdal对shp读取,新建和更新的实例
2020/03/10 Python
keras 获取某层输出 获取复用层的多次输出实例
2020/05/23 Python
如何利用Python给自己的头像加一个小国旗(小月饼)
2020/10/02 Python
Ted Baker英国官网:男士和女士服装及配件
2017/03/13 全球购物
Bonprix法国:时尚、鞋子、家居
2020/12/29 全球购物
美国在线家具网站:GDFStudio
2021/03/13 全球购物
区域销售主管岗位职责
2014/06/15 职场文书
小学社团活动总结
2014/06/27 职场文书
西双版纳导游词
2015/02/03 职场文书
2015年度内部审计工作总结
2015/05/20 职场文书
天鹅湖观后感
2015/06/09 职场文书
导游词之苏州阳澄湖
2019/11/15 职场文书
vue+spring boot实现校验码功能
2021/05/27 Vue.js
python标准库ElementTree处理xml
2022/05/20 Python