如何更改 <svg> 標記到 <img> 用js標記？

Question

我正在寫一個chrome擴展程序來更改某個朋友的某個網站的徽標。 問題在於徽標是<svg>標記。 如何更改js中的HTML標簽和內容？

Answer 1

不知道是否允許使用jQuery，但是可以使用replaceWith() ;

 $(document).ready(function(e) { $('svg').replaceWith('<img src="http://images.all-free-download.com/images/graphiclarge/smiley_10_55841.jpg" alt="smiley!"/>'); }); 

 svg { width: 200px; height:200px; } img { width: 200px; height: 200px; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="container"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"> <path d="M30,1h40l29,29v40l-29,29h-40l-29-29v-40z" stroke="#000" fill="none"/> <path d="M31,3h38l28,28v38l-28,28h-38l-28-28v-38z" fill="#a23"/> <text x="50" y="68" font-size="48" fill="#FFF" text-anchor="middle"><![CDATA[410]]></text> </svg> </div> 

如果只能使用JavaScript，則存在replaceChild函數。