`
bcyy
  • 浏览: 1828147 次
文章分类
社区版块
存档分类
最新评论

用js对table进行解析的demo,及用js修改table中文字颜色

 
阅读更多

一:用js对table进行解析:

<html>

<head>
<title>Table Test</title>
<meta name="generator" content="Editplus" />
<meta name="author" content="PJ" />
<script language="JavaScript">
<!--
function Delete()
{
var dgTable=document.getElementById('tb').rows;//tb为table的ID,
var pp=window.event.srcElement;

for (var i=0; i < dgTable.length; i++) //遍历table的行,
{
if(pp==dgTable[i].cells[2].getElementsByTagName("A")[0]) //cells[2]为触发事件的列的索引
{ //判断是否是触发事件的A标签
alert(dgTable[i].cells[0].innerText); //演示,弹出所在行的第一列的内容
}
}
}
//-->
</script>
</head>
<body>
<table id="tb" border="1px" width="500px">
<tr>
<td width="40%">aaa</td>
<td width="40%">bbb</td>
<td width="15%"><a onclick="Delete()" href="#">delete</a></td>
</tr>
<tr>
<td>ccc</td>
<td>ddd</td>
<td><a onclick="Delete()" href="#">delete</a></td>
</tr>
<tr>
<td>eee</td>
<td>fff</td>
<td><a onclick="Delete()" href="#">delete</a></td>
</tr>
</table>
</body>

</html>

二:js修改table中文字颜色

按理来说,这个实现应该很简单,直接找到文字,然后.style.color="red"即可,但是,试了几次,发现此法不奏效。取到文字之后直接改变的颜色的解决办法没有找到,希望有知道的可以告诉一下。这里我采用的是一个迂回之术,即先把文字拿出来,加上<font color>标签,再给放进去。


function changeColor(id,name){
var dgTable=document.getElementById('polling').rows;
var tmpName = "";
for (var i=1; i < dgTable.length; i++){ //遍历table的行,
tmpName= dgTable[i].cells[2].innerText;
tmpName = tmpGroupName.trim();
if(tmpName == name){ //选中该行
dgTable[i].cells[2].innerHTML = "<font color=\"#0000FF\">" + tmpName + "</font>";
document.getElementById("groupLanesFrm").src = path + "/systemConfigAction!showGroupLanes.action?groupId=" + id;
}else{
dgTable[i].cells[2].innerHTML = "<u>" + tmpName + "</u>";
}
}
//document.getElementById("groupLanesFrm").src = path + "/systemConfigAction!showGroupLanes.action?groupId=" + id;
}


PS:


innerText和innerHtml的区别:


innerText可以用来修改开始标签和结束标签之间的内容。
odiv.innerText = "hello";
innerText可以自动将一些关键字符编码(<,>,&),无须担心特殊字符。
innerHtml将标签在浏览器中解读。


对比:
var odiv = doucment.getElementById("div1");
odiv1.innerText = "<h1>HELLO</h1>"


会显示为<h1>HELLO</h1>
当将innerText改为innerHtml时,将会显示<H1>格式的HELLO











分享到:
评论

相关推荐

    二级理论题(选择83+判断96).xlsx

    二级理论题(选择83+判断96).xlsx

    2024年中国超声非侵入式腐蚀检测传感器行业研究报告.docx

    2024年中国超声非侵入式腐蚀检测传感器行业研究报告

    设备OEE实践与教学知识

    设备自动化综合利用率实践,详细描述了OEE各方面的参数与应用,让设备自动化工厂利用此工具可以快速提高生产

    tensorflow-gpu-2.2.3-cp37-cp37m-win-amd64.whl

    python

    server-jre-8u411-windows-x64.tar.gz

    server-jre-8u411-windows-x64.tar.gz

    node-v7.8.0-sunos-x64.tar.xz

    Node.js,简称Node,是一个开源且跨平台的JavaScript运行时环境,它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立,旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎,可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型,这使得它非常适合处理大量并发连接,从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外,Node.js使用了模块化的架构,通过npm(Node package manager,Node包管理器),社区成员可以共享和复用代码,极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展,它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等,因此,开发者可以用JavaScript编写全栈应用程序,这一点大大提高了开发效率和便捷性。 在实践中,许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台,如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能,简化了开发流程,并且能更快地响应市场需求。

    基于51单片机秒表的程序设计.RAR

    单片机学习代码资料

    升压斩波电路Multisim源文件-输入电压DC15V,输出电压调节范围:+18V~+30V,电流:500mA~100mA范围

    输入电压DC15V,输出电压调节范围:+18V~+30V,电流:500mA~100mA范围,纹波1%

    nacos-server-2.3.2

    nacos-server-2.3.2

    聚类微博数据可视化分析系统 技术框架python + django + mysql + nlp + 聚类 +pycharm

    聚类微博数据可视化分析系统 技术框架 python + django + mysql + nlp + 聚类 +pycharm 角色介绍 普通用户 qqq 123456 模块分析 登录注册 数据获取 数据处理 数据挖掘 NLP情感分析 K-means聚类分析 敏感词预警 (支持邮箱发送模式) 不同聚类 (三个不同的聚类计算结果对比,选择最优的聚类来显示) 数据可视化模块 大事件数据可视化 热点数据排行 热门主题词云 评论数据可视化 时间顺序可视化 退出模块 数据库weibo_nlp_system 分析原理 我的最爱是动漫,你喜欢什么呢? 我 的 最爱 是 动漫 你 喜欢 什么 呢

    选择判断题库.doc

    选择判断题库.doc

    青藏高原城市化和生态环境迫切化大屏数据可视化系统

    【作品名称】:青藏高原城市化和生态环境迫切化大屏数据可视化系统 【适用人群】:适用于希望学习不同技术领域的小白或进阶学习者。可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。

    TCABEE 008-2020 轨道交通车站高效空调系统技术标准.pdf

    TCABEE 008-2020 轨道交通车站高效空调系统技术标准.pdf

    MySQL笔记思维导图

    MySQL笔记思维导图

    Windows 10 Docker 安装教程

    附件是Windows 10 Docker 安装教程, 文件绿色安全,请大家放心下载,仅供交流学习使用,无任何商业目的!

    node-v4.4.1-x86.msi

    Node.js,简称Node,是一个开源且跨平台的JavaScript运行时环境,它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立,旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎,可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型,这使得它非常适合处理大量并发连接,从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外,Node.js使用了模块化的架构,通过npm(Node package manager,Node包管理器),社区成员可以共享和复用代码,极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展,它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等,因此,开发者可以用JavaScript编写全栈应用程序,这一点大大提高了开发效率和便捷性。 在实践中,许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台,如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能,简化了开发流程,并且能更快地响应市场需求。

    东北大学信息学院控制与科学博士课程《matlab语言与应用》薛定宇课程作业 chapter1-chapter14 自己做的

    东北大学信息学院控制与科学博士课程《matlab语言与应用》薛定宇课程作业 chapter1-chapter14 自己做的

    azure-ai-services-speech-service(微软语音服务文档)

    azure-ai-services-speech-service(微软语音服务文档)

    数据库课程设计涵盖了从需求分析、概念设计、逻辑设计到物理设计的整个数据库设计流程 为了帮助学生更好地理解和掌握这些内容,课程设计

    数据库课程设计涵盖了从需求分析、概念设计、逻辑设计到物理设计的整个数据库设计流程。为了帮助学生更好地理解和掌握这些内容,课程设计提供了丰富的学习资源。 首先,课程提供了详细的教学课件和PPT,这些资源系统地介绍了数据库设计的基本概念和步骤,帮助学生建立起对数据库设计的整体认识。 其次,课程设计还提供了大量的实践案例和练习题。学生可以通过分析实际案例,了解数据库设计在实际应用中的具体实现方法。同时,练习题可以帮助学生巩固所学知识,提高实际操作能力。 此外,课程设计还鼓励学生利用网络资源进行学习。学生可以通过在线教程、视频系列以及经典的数据库设计书籍等拓展学习视野,深入了解数据库设计的最新技术和方法。 最后,课程设计还强调团队协作和沟通能力的培养。学生需要分组完成设计任务,通过团队合作解决问题,提高协作和沟通能力。 总之,数据库课程设计提供了丰富的学习资源和实践机会,帮助学生全面掌握数据库设计的基本知识和技能。通过这门课程的学习,学生将能够为后续的数据库应用开发和数据管理工作打下坚实的基础。

    17.rar

    17.rar

Global site tag (gtag.js) - Google Analytics