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 仿QQ校友的DIV模拟窗口效果源码
Mar 24 Javascript
Javascript图像处理—虚拟边缘介绍及使用方法
Dec 27 Javascript
JS将光标聚焦在文本最后的实现代码
Mar 28 Javascript
jQuery实现首页顶部可伸缩广告特效代码
Apr 15 Javascript
angularjs客户端实现压缩图片文件并上传实例
Jul 06 Javascript
JavaScript Length 属性的总结
Nov 02 Javascript
深入解析JavaScript中的arguments对象
Jun 12 Javascript
JS实现简易刻度时钟示例代码
Mar 11 Javascript
基于vue实现可搜索下拉框定制组件
Mar 26 Javascript
angular.js实现列表orderby排序的方法
Oct 02 Javascript
JS中FileReader类实现文件上传及时预览功能
Mar 27 Javascript
vue @click.native 绑定原生点击事件
Apr 22 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&amp;&amp;mysql)五
2006/10/09 PHP
php radio 单选框获取与保持值的实现代码
2010/05/15 PHP
PHP高手需要要掌握的知识点
2014/08/21 PHP
PHP中Array相关函数简介
2016/07/03 PHP
Avengerls vs KG BO3 第三场2.18
2021/03/10 DOTA
jQuery 学习第五课 Ajax 使用说明
2010/05/17 Javascript
jQuery实战之仿淘宝商城左侧导航效果
2011/04/12 Javascript
三级下拉菜单的js实现代码
2011/05/23 Javascript
能说明你的Javascript技术很烂的五个原因分析
2011/10/28 Javascript
通过action传过来的值在option获取进行验证的方法
2013/11/14 Javascript
JQUERY 设置SELECT选中项代码
2014/02/07 Javascript
JavaScript设计模式之建造者模式介绍
2014/12/28 Javascript
jQuery事件绑定与解除绑定实现方法
2015/04/15 Javascript
localResizeIMG先压缩后使用ajax无刷新上传(移动端)
2015/08/11 Javascript
使用Sticky组件实现带sticky效果的tab导航和滚动导航的方法
2016/03/22 Javascript
Angular的模块化(代码分享)
2016/12/26 Javascript
详解基于 Node.js 的轻量级云函数功能实现
2019/07/08 Javascript
vue+openlayers绘制省市边界线
2020/12/24 Vue.js
Python中使用logging模块代替print(logging简明指南)
2014/07/09 Python
python 3.6 tkinter+urllib+json实现火车车次信息查询功能
2017/12/20 Python
python使用turtle库绘制时钟
2020/03/25 Python
Python 控制终端输出文字的实例
2019/07/12 Python
pandas 强制类型转换 df.astype实例
2020/04/09 Python
Tensorflow安装问题: Could not find a version that satisfies the requirement tensorflow
2020/04/20 Python
Python中的全局变量如何理解
2020/06/04 Python
在IE6系列等老式浏览器中使用HTML5的新标签实现方案
2012/12/25 HTML / CSS
美国最大的网络男装服装品牌:Bonobos
2017/05/25 全球购物
Missguided美国官网:英国时尚品牌
2018/01/18 全球购物
俄罗斯运动、健康和美容产品在线商店:Lactomin.ru
2020/07/23 全球购物
什么是servlet
2012/05/08 面试题
我为党旗添光彩演讲稿
2014/09/13 职场文书
邮政营业员岗位职责
2015/04/14 职场文书
2015年煤矿工作总结
2015/04/28 职场文书
中秋联欢会主持词
2015/07/04 职场文书
JavaScript中isPrototypeOf函数
2021/11/07 Javascript
关于的python五子棋的算法
2022/05/02 Python