Question

如何使用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>

Answer 1

＆＃13;

<!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>

＆＃13;

Answer 2

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

MDN Docs on innerHTML

如何使用childNodes（Javascript）更改元素的内容？

2 个答案: