0
<body>
<div>
    <p id="test"></p>
</div>
<script>
    //  I'm trying to clone an element
    var h1 = document.createElement('h1'); // I create <h1>
    h1.innerHTML('test'); // I put some text between this element <h1>test</h1>
    document.getElementById('test').appendChild(h1); // I add this h1 to <p id="test"><h1>test</h>
    var h1Clone = h1.cloneNode(true); // I use cloneNode to clone h1

    // Here I'll clone the <p> tag and add h1Clone to it
    var paragraph = document.getElementById('test'); // Look for id="test"
    paragraph.appendChild(h1); // Add h1 as <p>'s child
    var paragraphClone = paragraph.cloneNode(true); // Clone <p>
    paragraphClone.appendChild(h1Clone); // Add h1Clone as <p>'s (clone) child.

    paragraph.parentNode.appendChild(paragraphClone); // Finally I add <p>'s clone to <body> tag
</script>
</body>
</html>

您好,我评论了所有内容,以便您了解我正在尝试做的事情。为什么我不能让它工作?

这是我想要的最终 html 结果:

<p id="test"><h1>test</h1></p>
<p id="test"><h1>test</h1></p> <-- clone ->
4

2 回答 2

3

改变h1.innerHTML = 'test';而不是h1.innerHTML('test')

于 2012-10-30T10:12:30.287 回答
2

如果可以使用 jQuery,那就很简单了:

第 1 步:添加 jQuery 库。在该<head>部分中,添加以下内容:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

第 2 步:<script>该部分的标签中<body>,而不是您的代码中,给出以下内容:

$("#test").clone().appendTo("div");

就如此容易。

在这里演示:http: //jsfiddle.net/GeQpH/

于 2012-10-30T10:15:43.443 回答