2017-08-07 4 views
0

私は、jqueryを使用して再帰関数によって、順序付けられていないリスト、リストアイテム、および属性を含むhtml構造を動的に作成しました。次に、属性タグ内に画像を追加しました。今はそのイメージをCSSファイルでスタイルしたいと思います。属性タグには、jsonの名前値も含まれています。コンテキストメニューでこれをすべて表示しています。私は名前の左側にイメージを表示するつもりです。現在、私が追加した画像は、名前の中央と右に表示されており、画像のサイズも大きすぎます。私は画像の位置と大きさを調整したい。この場合、画像を動的に追加しているときに、どうすればいいですか? '<img class="my-image" src="'+src+'"/>'を経由して、それにクラスを追加し、それはあなたのCSSで対応するルールを見つけ、それらを適用するか、また、jQueryを介して、それを追加することができます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; 
    }; 
+0

イメージにクラススタイルを追加する必要がありますか? –

+0

@FerasAlSousはい。 – Salman

答えて

0

イメージの位置とサイズを調整したいと思います。この場合、画像を動的に追加しているときに、どうすればいいですか?

ファイルの位置とサイズの定義でCSSルールを追加します。あなたのクラス名はimgStyleとしましょう。以下のように、このクラスをイメージタグに追加してください。

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

次のいずれか:ここではHTML構造を作る機能がある

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

最初は少しクリーナーです。

関連する問題