HTMLオブジェクトから要素を取得するjavascript

Question

私はHTML文字列を持っており、img要素を取得して初期化したいと考えています。

var discountItem = '<li class="sidebar-brand" style="font-weight: bold; color: #9999 class="col-item">' + 
      '<div class="post-img-content">' + 
       '<img src=" " class="img-responsive" id="mimo" />'+ 
       '<span class="post-title">'+ 
        '<b>Perfumes</b><br>'+ 
        '<b>Clássico</b>'+ 
       '</span>'+ 
       '<span class="round-tag">-15%</span>'+ 
      '</div>'+ 
      '</li>'; 

     var k = app.clone(discountItem); 


     var df = document.createDocumentFragment(); 

     // create a placeholder node to hold the innerHTML 
     var el = document.createElement('body'); 
     el.innerHTML = k; 

     // append to the document fragment 
     df.appendChild(el); 

     // execute .getElementById 
     console.log(df.getElementByClassName('img-responsive');   

     view += k; 

clone : function(obj){ 
    try{ 
     var copy = JSON.parse(JSON.stringify(obj)); 
    } catch(ex){ 
     console.log("you are using an old navigator"); 
    } 
    return copy; 
} 

私はこれを試しましたが動作しません。

私の目標はイメージのsrcを初期化することです。 誰かが私を助けることができますか？

Answer 1

あなたがimg要素を検索しようとしている場合、あなたははるかに少ない作業を行うことができます：ちょうど、bodyを作成し、それにそのHTMLを追加し、querySelectorを使用します。

var discountItem = '<li class="sidebar-brand" style="font-weight: bold; color: #9999 class="col-item">' + 
 
      '<div class="post-img-content">' + 
 
       '<img src=" " class="img-responsive" id="mimo" />'+ 
 
       '<span class="post-title">'+ 
 
        '<b>Perfumes</b><br>'+ 
 
        '<b>Clássico</b>'+ 
 
       '</span>'+ 
 
       '<span class="round-tag">-15%</span>'+ 
 
      '</div>'+ 
 
      '</li>'; 
 
var body = document.createElement("body"); 
 
body.innerHTML = discountItem; 
 
var img = body.querySelector(".img-responsive"); 
 
img.src = "source path here";