javascript - 使用子节点innerHTML更改元素的标题

Question

我有一个网页，它使用 JQuery ToolTips 插件来弹出带有额外信息的框。一切正常，没有任何问题。

但是，为了使弹出框完美工作，我需要给出有问题的标题中的元素，详细说明我希望弹出框说的内容。如果我可以直接更改 HTML，这会很简单，但我只能通过 JS 来完成。更让我烦恼的是，工具提示会根据元素 insideHTML 中的内容而变化，但元素本身没有 ID。但它的父级确实有一个 ID。

所以我一直在尝试通过父节点访问子节点，读取它的innerHTML，将其与一些if语句进行比较，然后根据这个innerHTML将标题应用到父节点。

这是我的代码:

for(var i = 1; i<5; i++){
        var q = document.getElementById("cell.0."+i);
        console.log(i+" "+q);
        if(q.children[0].innerHtml === "some text1"){
            q.setAttribute('title', 'Other text1');
        }
        else if(q.children[0].innerHtml === "some text2"){
            q.setAttribute('title', 'Other text2');
        }
        else if(q.children[0].innerHtml === "some text3"){
            q.setAttribute('title', 'Other text3');
        }
        else if(q.children[0].innerHtml === "some text4"){
            q.setAttribute('title', 'Other text4');
        }
    }

还有一个附带的 JSFiddle 让它更清楚一点:http://jsfiddle.net/qxb58/7/

注意:JSFiddle 使用按钮，但我使用的实际功能将在页面加载时进行。

我一直在测试控制台中的每一行。据我所知，所有可在控制台中立即测试的语句(例如 q.children[0].innerHtml === "some text4"和 q.setAttribute('title', 'Other text4');)。但当放入 for 循环时，它似乎不起作用。

请注意，这不太可能是 HTML 错误，因为我的 HTML 是自动生成的并且可以正常工作。如果 fiddle 中的 HTML 出现错误，那是我对 HTML 的理解很糟糕。不过还是感谢您指出!

编辑:解决方案:innerHTML而不是innerHtml。很抱歉犯了愚蠢的错误。感谢您的帮助!

Answer 1

您正在执行 javascript onload，这意味着当使用函数 changer() 创建 DOM 时，当时它是未定义的。此外，您正在寻找属性 innerHtml 而不是 innerHTML。属性区分大小写。通过这两个更改，它可以正常工作:

JSFiddle