如何樣式化使用jquery動態添加的圖像？

我已經通過使用jQuery的遞歸函數動態地製作了包含無序列表，列表項和屬性的html結構。然後我在屬性標籤內添加了一個圖像。現在我想在css文件中設置該圖像的樣式。屬性標記還包含來自我的json的名稱值。我在上下文菜單中顯示了所有這些內容。我打算在名稱的左側顯示圖像。目前，我添加的圖像出現在名稱的中心和右側，圖像的大小也太大。我想調整圖像的位置和大小。我在這種情況下如何動態地添加圖像？下面是使HTML結構的功能：如何樣式化使用jquery動態添加的圖像？

var getMenuItem = function (itemData) { 
     var item = $("<li>") 
      .append(
     $("<a>", { 
      title : itemData.name, 
      html : itemData.name 
     }).append($("<img>", {"src": "Boma_1_2/Boma.png"}))); 
     if (itemData.children) { 
      var subList = $("<ul>"); 
      $.each(itemData.children, function() { 
       subList.append(getMenuItem(this)); 
      }); 
      item.append(subList); 
     } 
     return item; 
    };

來源

2017-08-07 Salman

您需要添加類風格的圖像？ –

@FerasAlSous是的。 – Salman

我想調整圖像的位置和大小。我在這種情況下如何動態地添加圖像？

使用您的位置和大小定義在文件中添加CSS規則。讓我們假設你的班級名稱是imgStyle。只需在創建過程中將此類添加到圖像標記中，如下所示。

$("<img>", {"src": "Boma_1_2/Boma.png","class": "imgStyle"})

來源

2017-08-07 13:33:56

或者通過'<img class="my-image" src="'+src+'"/>'添加一個類，它就會發現在你的CSS相應的規則，並將這些，或者你也可以通過jQuery添加：

var $img = $("<img>", {"src": "Boma_1_2/Boma.png"}) 
$img.css({width:'40px'}) 
$link.append($img)

第一個是一個更清潔。

來源

2017-08-07 13:31:44

如何樣式化使用jquery動態添加的圖像？

回答

相關問題