0

如何使用 childNodes (Javascript) 更改元素的内容？我尝试了一些东西，但没有奏效。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Zitat</title>
        <script type="text/javascript">
            var htmlNode = document.documentElement;
            var emNode = htmlNode.childNodes[1].childNodes[0].childNodes[1].childNodes[1];
            emNode.innerHtml = "BBB";
        </script>
    </head>
    <body>
        <ul>
            <li>Hello World</li>
            <li>AAA <em>DDD</em> CCC.</li>
        </ul>
    </body>
</html>
4

2 回答 2

2 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Zitat</title>
        <script>
            document.addEventListener("DOMContentLoaded", function (event) {
                var arrAllListTags = document.querySelectorAll("li");
                arrAllListTags[1].childNodes[1].textContent = "BBB";
            });
        </script>
    </head>
    <body>
        <ul>
            <li>Hello World</li>
            <li>AAA <em>DDD</em> CCC.</li>
        </ul>
    </body>
</html>

于 2016-02-01T18:26:16.897 回答
1

首先，脚本标签应该放在标记之后，否则它将在您尝试修改的实际 html 实际呈现之前运行。其次，我认为您的选择器是错误的。childNodes是 DOM 对象的有效属性，但您的链中有错误。第三，我会使用document.querySelector目标元素，而不是childNodes. 最后，使用innerHTML(not innerHtml) 设置 html 内容，或者textContent如果它是您尝试更新的 Text 节点。

关于 innerHTML 的 MDN 文档

于 2016-02-01T17:55:43.647 回答