为什么不显示此段落属性的子节点?

问题描述 投票:0回答:1

我不熟悉JavaScript,我在编辑器上放置了一些代码以对其进行测试。

我正在尝试通过将子节点附加到“ p”属性来动态创建元素,但是没有看到这些子节点显示。您能解释一下原因,以及如何显示所有节点吗?

这里是代码:

<html> 
<head> 
<title>t1</title> 
<script type="text/javascript"> 
    function addNode() { 
    var newP = document.createElement("p"); 
        var textNode = document.createTextNode(" This is a new text node"); 
        newP.appendChild(textNode); 
    document.getElementById("firstP").appendChild(newP); 
  } 
</script> </head> 
<body> <p id="firstP">firstP<p> </body> 
</html>

这里是输出:firstP

我期望得到:

firstP
p
This is a new text node
javascript html dom
1个回答
0
投票

您犯了错字错误,需要将子节点添加到p父标记中,因此将p标记插入div标记中效果更好,这将起作用;-)

<html>
<head> 
<title>t1</title> 
</head> 
<body>
    <div id="firstPContainer">
        <p>firstP</p>
    </div>
    <script type="text/javascript"> 
    function addNode() { 
        var newP = document.createElement("p"); 
            var textNode = document.createTextNode(" This is a new text node"); 
            newP.appendChild(textNode); 
            document.getElementById("firstPContainer").appendChild(newP); 
    }
    addNode();
</script>
</body> 
</html>
© www.soinside.com 2019 - 2024. All rights reserved.