首先,我不知道是否将对象称为正确的名称。

但是是否有可能循环遍历html文件并选择带有样式属性bgcolor的标签(我知道这已经过时了)。

每x次,我需要具有style属性bgcolor的元素。具有其他元素以外的其他颜色。 x的时间量是不规则的并且不是恒定的,除了bgcolor标签之外没有其他常数。

为了将其用作起点,我试图弄清楚我可以使用的元素表现一致。找到的唯一一个是bgcolor标记。

这是我从中检索html信息的代码。

<?php
    //get url var
    $page = $_GET['page'];
    if(empty($page)){
        $page = '2';
    }
$page2nav = '';

if($page=="2"){
    $output = file_get_contents('linktodata');
    $output = strip_tags($output,'<body><div><button><style><td><table><td.white><tr><tbody><b><script>');
    $page2nav = ' class="active"';
}
?>


    <div class="contentwrapper">
      <div class="content">
        <?php echo $output; ?>
    </div>
    </div>


用PHP脚本拉出的CSS

<style type="text/css">
    td.white{border-style: none;}
    TD {font-family: Arial;
        font-size: 11pt;
        max-width: 500px;
        word-wrap: break-word;}
    body {color: black; background: white;}
    table { border-collapse: collapse }
    td { border: 1px solid black
         max-width: 500px;
         word-wrap: break-word;}
    </style>


<TABLE BORDER=1 id="table"><tbody><tr bgcolor="orange"><td colspan="9">blablablablablablablabla</td></tr><tr><b><td>datum</td><td align="center">M</td><td align="center">V</td><td>blabla</td><td>resource</td><td>blablag</td></tr><tr bgcolor="orange">
<td> <b>22-04-2019</b> </td>
<td align="center"> <b>6</b> </td>
<td align="center"> <b>4</b> </td>
<td> <b>blabla</b> </td>
<td> <b> no caterteam </b> </td>
<td> <b>no kok </b> </td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25">6</td>
<td align="center" width="25"></td>
<td>blabla</td>
<td>blabla</td>
<td>blabla</td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25"></td>
<td align="center" width="25">4</td>
<td>blabla</td>
<td>PersoneelsCatering Veggie</td>
<td>avondcatering</td>
</tr><tr bgcolor="orange">
<td> <b>23-04-2019</b> </td>
<td align="center"> <b>14</b> </td>
<td align="center"> <b>10</b> </td>
<td> <b>blabla</b> </td>
<td> <b>blala</b> </td>
<td> <b>blabla </b> </td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25"></td>
<td align="center" width="25">4</td>
<td></td>
<td>blalal</td>
<td>blalal</td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25">6</td>
<td align="center" width="25"></td>
<td>blabla</td>
<td>blabla</td>
<td>blabla</td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25">1</td>
<td align="center" width="25"></td>
<td></td>
<td>blabla</td>
<td>blabla</td>
</tr>


唯一重复的是bgcolor:orange。

我的计划是用其他颜色的橙色更改这些行。

最佳答案

这是使用bgcolor属性更改元素的一种方法。看看是否适合您。如果没有更好的解释,我会尽力帮助您。



function changeBgColorElements(color) {
    var list = document.querySelectorAll('[bgcolor]');
    list.forEach(e=>e.setAttribute('bgcolor',color));
}


changeBgColorElements('green');

<TABLE BORDER=1 id="table"><tbody><tr bgcolor="orange"><td colspan="9">blablablablablablablabla</td></tr><tr><b><td>datum</td><td align="center">M</td><td align="center">V</td><td>blabla</td><td>resource</td><td>blablag</td></tr><tr bgcolor="orange">
<td> <b>22-04-2019</b> </td>
<td align="center"> <b>6</b> </td>
<td align="center"> <b>4</b> </td>
<td> <b>blabla</b> </td>
<td> <b> no caterteam </b> </td>
<td> <b>no kok </b> </td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25">6</td>
<td align="center" width="25"></td>
<td>blabla</td>
<td>blabla</td>
<td>blabla</td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25"></td>
<td align="center" width="25">4</td>
<td>blabla</td>
<td>PersoneelsCatering Veggie</td>
<td>avondcatering</td>
</tr><tr bgcolor="orange">
<td> <b>23-04-2019</b> </td>
<td align="center"> <b>14</b> </td>
<td align="center"> <b>10</b> </td>
<td> <b>blabla</b> </td>
<td> <b>blala</b> </td>
<td> <b>blabla </b> </td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25"></td>
<td align="center" width="25">4</td>
<td></td>
<td>blalal</td>
<td>blalal</td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25">6</td>
<td align="center" width="25"></td>
<td>blabla</td>
<td>blabla</td>
<td>blabla</td>
</tr>
<tr>
<td class="white"></td>
<td align="center" width="25">1</td>
<td align="center" width="25"></td>
<td></td>
<td>blabla</td>
<td>blabla</td>
</tr>

关于javascript - 查找具有样式属性的元素并进行更改,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/55832541/

10-10 21:43