Javascript　innerHTMLで要素の移動

2008/11/17 11:34 Update

Javascript　innerHTMLで簡単に要素を移動させるサンプルです。

サンプル

<html>
    <head>
    
        <title>javascript innerHTML</title>
        
        <script type="text/javascript">
            function moveElement(orgId, destId){
                org = $(orgId);
                dest = $(destId);
                
                dest.innerHTML = org.innerHTML;
                org.innerHTML = '';
            }
            
            //prototype.jsを使う場合、prototypeの$()メソッドで入れ替えてください。
            function $(element) {
              return document.getElementById(element);
            }

        // -->
        </script>
        
    </head>

<body onload="moveElement('org', 'dest');">
        <div id="dest">
        </div>
        <hr />
        <div id="org">
            Hello javascript innerHTML
        </div>
</body>

</head>

>> 実行してみる