JavaScript在Div标记上动态附加另一个Div数据_Javascript

JavaScript在Div标记上动态附加另一个Div数据

javascript

JavaScript在Div标记上动态附加另一个Div数据,javascript,Javascript,我想动态地将已定义的“old div”标记的内容附加到“new div”标记，但它不起作用。我尝试的代码附在下面。还有一个问题，如何动态删除附加的div标记 <html> <head> <script type="text/javascript"> function add() { var i = document.getElementById( 'old' ); var d = document.getElementById( 'new' ); d.a

我想动态地将已定义的“old div”标记的内容附加到“new div”标记，但它不起作用。我尝试的代码附在下面。还有一个问题，如何动态删除附加的div标记

<html>
<head>
<script type="text/javascript">

function add() {

var i = document.getElementById( 'old' );
var d = document.getElementById( 'new' );
d.appendChild( i );
}
</script>

</head>
<body>
<div id="old">
Content of old div
</div>

<div id="new">
</div>
<button onclick="add()">Add</button>
</body>
</html>


函数add（）{
var i=document.getElementById（'old'）；
var d=document.getElementById（'new'）；
d、 儿童（一）；
}
旧分区的内容
添加

好的，我解决了。我的代码中有一些错误。现在开始工作了

    <html>
    <head>
        <script type="text/javascript">

            function add() {

        var i = document.getElementById( 'old' );

        var d = document.createElement( 'div' );
        d.id = "new1";
        d.innerHTML = i.innerHTML ;
        var p = document.getElementById('new');

        p.appendChild(d);

    }

    function removeLocation() {

        var d = document.getElementById( 'new1' );

        var p = document.getElementById('new');

        p.removeChild(d);

    }
        </script>

    </head>
    <body>
        <div id="old">
            Content of old div
        </div>

        <hr/>
        <div id="new">
        </div>
        <hr/>
        <button onclick="add();">Add</button><br>
        <button onclick="removeLocation();">Remove</button>
    </body>
    </html>


函数add（）{
var i=document.getElementById（'old'）；
var d=document.createElement（'div'）；
d、 id=“new1”；
d、 innerHTML=i.innerHTML；
var p=document.getElementById（'new'）；
p、 儿童（d）；
}
函数removeLocation（）{
var d=document.getElementById（'new1'）；
var p=document.getElementById（'new'）；
p、 removeChild（d）；
}
旧分区的内容


添加

去除

好的，我解决了。我的代码中有一些错误。现在开始工作了

    <html>
    <head>
        <script type="text/javascript">

            function add() {

        var i = document.getElementById( 'old' );

        var d = document.createElement( 'div' );
        d.id = "new1";
        d.innerHTML = i.innerHTML ;
        var p = document.getElementById('new');

        p.appendChild(d);

    }

    function removeLocation() {

        var d = document.getElementById( 'new1' );

        var p = document.getElementById('new');

        p.removeChild(d);

    }
        </script>

    </head>
    <body>
        <div id="old">
            Content of old div
        </div>

        <hr/>
        <div id="new">
        </div>
        <hr/>
        <button onclick="add();">Add</button><br>
        <button onclick="removeLocation();">Remove</button>
    </body>
    </html>


函数add（）{
var i=document.getElementById（'old'）；
var d=document.createElement（'div'）；
d、 id=“new1”；
d、 innerHTML=i.innerHTML；
var p=document.getElementById（'new'）；
p、 儿童（d）；
}
函数removeLocation（）{
var d=document.getElementById（'new1'）；
var p=document.getElementById（'new'）；
p、 removeChild（d）；
}
旧分区的内容


添加

去除

试试这个

var i = document.getElementById( 'old' );
var d = document.getElementById( 'new' );
d.innerHTML += i.innerHTML;

试试这个

var i = document.getElementById( 'old' );
var d = document.getElementById( 'new' );
d.innerHTML += i.innerHTML;

伟大的你使它变得简单多了。我投你的票。：-）innerHTML不是一种很好的方法，所以我建议使用appendChild而不是；）伟大的你使它变得简单多了。我投你的票。：-）innerHTML不是一种很好的方法，所以我建议使用appendChild而不是；）这真是个好主意，真是个好主意。