改變HTML元素的地方的JavaScript

Question

我想借此img.fnone並通過JavaScript或jQuery的 span.ddlabel元素替換另一個地方有什麼功能做

<span id="flat_title" class="ddTitleText "> 
    <img class="fnone" src="images/pinc.png"> 
    <span class="ddlabel">A</span> 
    <span class="description" style="display: none;"></span> 
    </span> 

Answer 1

使用append()

var targetSPAN=$('#flat_title'); 
var image=$('img.fnone', targetSPAN); 

$('span.ddlabel', targetSPAN).append(image); 

JSFIDDLE DEMO

Answer 2

<script type="text/javascript"> 
    $(document).ready(function() { 

     $('span .ddlabel').append('<img class="fnone" src="images/pinc.png">'); 
     $('#flat_title img:first').remove() 

    }); 

</script> 

Answer 3

利用element.appendChild方法。

<span id="flat_title" class="ddTitleText "> 
    <img class="fnone" src="images/pinc.png" /> 
    <span class="ddlabel">A</span> 
    <span class="description" style="display: none;"></span> 
</span> 
<div> 
    <button id="abc">Click to replace</button> 
</div> 
<script> 
document.getElementById('abc').addEventListener('click',function(){ 
    var parent = document.getElementById('flat_title'), 
    img = document.getElementsByClassName('fnone')[0], 
    description = document.getElementsByClassName('description')[0]; 

    parent.appendChild(img); 
    parent.appendChild(description); 
}) 
</script> 

檢查它http://jsfiddle.net/fWK67/

Answer 4

使用html（）

var html=$("img.fnone").html(); 
$("span.ddlabel").html(html); 
$("img.fnone").remove();