更改特定表格单元格内容背景的问题

时间:2018-04-17 09:39:21

标签: javascript html

我正在尝试创建一个曾经创建的表,并且随机选择一个动物从阵列进入单元格,可以从下拉菜单中选择动物并更改包含表格中所有元素的颜色这只动物。

这是我上传的作品的链接,猫的这种颜色变化的功能特别是在第149行。我的问题是,一旦我在下拉菜单中选择猫,我什么都没得到。?

FIDDLE

  

目标代码:

function catColor() {
    var tdTags = document.getElementsByTagName("td");
    var searchText = "cat";

    for (var i = 0; i < tdTags.length; i++) {
        if (tdTags[i].textContent == searchText) {
            document.tdTags[i].style.backgroundColor = "blue";
        }
    }
}

1 个答案:

答案 0 :(得分:2)

不要这样做:

cat.addEventListener("select", function() { // WRONG !!!!!
    catColor();
})

这样做:

var animalSelect = document.getElementById("dropDown");
animalSelect .addEventListener("change", function(ev) {
    var selectedAnimal = ev.currentTarget.value;
    console.log(selectedAnimal);
})

另外,不要这样做:

document.tdTags[i].style.backgroundColor = "blue"; // WRONG !!!!!

这样做:

tdTags[i].style.backgroundColor = "blue";