如何动态改变tabe单元格的文字颜色? [英] How to change dynamically tabe cell text colors?

查看:119
本文介绍了如何动态改变tabe单元格的文字颜色?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我需要一个解决方案,通过JavaScript动态更改表格单元格的文本颜色。文本可以是以下颜色:蓝,绿,红和黑。

p> < HTML>
< head>
< title>< / title>
< meta http-equiv =content-typecontent =text / html; charset =UTF-8>
< script src =jquery-mobile / jquery-1.6。 4.min.jstype =text / javascript>< / script>
< script src =jquery-mobile / jquery.mobile-1.0.min.jstype =text / javascript >< / script>
< / head>
< body>
< div data-role =pageid =page>
< div data-role =content>
< table width =100%border =0id =friendsclass =menu>
< tr id =friend1>
< td>名字< / td>
< td>姓< / td>
< / tr>
< tr id =friend2>
< td>名字< / td>
< td>姓氏< / td>
< / tr>
< tr id =friend3>
< td>名字< / td>
< td>姓< / td>
< / tr>
< tr id =friend4>
< td>名字< / td>
< td>姓氏< / td>
< / tr>
< tr id =friend5>
< td>名字< / td>
< td>姓氏< / td>
< / tr>
< / table>
< / div>
< / div>
< / body>
< / html>

如何更改文字颜色?条件是,我可以通过JavaScript动态地做到这一点,并且不止一次。这意味着我需要设置一种颜色(例如红色),稍后将颜色重置为黑色并将其设置为其他颜色(例如蓝色)。



我看到一些示例通过id设置颜色,但我没有办法将此示例转移到表格单元格,并且每个单元格可以具有不同的颜色。



有人可以帮我吗?

解决方案

您可以通过所有td的

  var tds = document.getElementsByTagName(td); (var i = 0,j = tds.length; i  tds [i] .style.color =#00AA00的

;



您可以通过td它们是特殊元素的子元素:

  var myNode = document.getElementById(friend2); 
var tds = myNode.getElementsByTagName(td); (var i = 0,j = tds.length; i tds [i] .style.color =#00AA00的

;

问候!


I need a solution to change dynamically via javascript the text color of table cells. The text can be the following colors: blue, green, red and black.

Table example:

<html>
  <head>
    <title></title>
    <meta http-equiv="content-type" content="text/html; charset="UTF-8">
    <script src="jquery-mobile/jquery-1.6.4.min.js"       type="text/javascript"></script>
    <script src="jquery-mobile/jquery.mobile-1.0.min.js"  type="text/javascript"></script>
  </head>
  <body>
  <div data-role="page" id="page">
    <div data-role="content">
      <table width="100%" border="0" id="friends" class="menu">
        <tr id="friend1">
          <td>First name</td>
          <td>Surname</td>
        </tr>
        <tr id="friend2">
          <td>First name</td>
          <td>Surname</td>
        </tr>
        <tr id="friend3">
          <td>First name</td>
          <td>Surname</td>
        </tr>
        <tr id="friend4">
          <td>First name</td>
          <td>Surname</td>
        </tr>
        <tr id="friend5">
          <td>First name</td>
          <td>Surname</td>
        </tr>
      </table>
    </div>
  </div>
  </body>
</html>

How can I change the text color? Conditions are, that I could do this dynamically via javascript and more than one time. That means I need to set a color (e.g. red), later reset the color to black and set it following to another color (e.g. blue).

I saw some examples with setting the color via id, but I found no way to transfer this example to table cells and each cell could have different colors.

Can someone help me?

解决方案

you can go through all td's

var tds = document.getElementsByTagName("td");

for(var i = 0, j = tds.length; i < j; ++i)
   tds[i].style.color = "#00AA00";

OR

you can go through td's that are childs of a special element:

var myNode = document.getElementById("friend2");
var tds = myNode.getElementsByTagName("td");

    for(var i = 0, j = tds.length; i < j; ++i)
       tds[i].style.color = "#00AA00";

greetings!

这篇关于如何动态改变tabe单元格的文字颜色?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆