2

XMLファイル内の関連する各タグをループして、このコードを実行しています。

$('<div class="product_image"></div>').html('<a href="'+url+'"><img src='+urlZoomImage+' /></a>').appendTo('#content');
$('<div class="product_title"></div>').html('<a href="'+url+'">'+title+'</a>').appendTo('#content');

product_imageとproduct_titleを、次のようにproduct_boxというdivで囲みたいと思います。

<div id="content">
  <div class="product_box">
    <div class="product_image">My image code</div>
    <div class="product_title">My title code</div>
  </div>
</div>

コンテンツdivのみがHTMLで記述されており、このままである必要があります(product_boxコードは、検索が成功するたびに生成されるため、そこに記述できません)。どうすればよいですか?

前もって感謝します。

4

3 に答える 3

5

jQueryを使用してHTML要素を作成すると、コードに簡単に迷う可能性があります。個別の要素を変数に保存し、初期化後にそれらを配置してみてください。このような:

var div_box = $('<div></div>').addClass('product_box');
var div_image = $('<div></div>').addClass('product_image').html('<a href="'+url+'"><img src='+urlZoomImage+' /></a>');
var div_title = $('<div></div>').addClass('product_title').html('<a href="'+url+'">'+title+'</a>');
$('#content').append(div_box.append(div_image).append(div_title));
于 2012-11-14T12:20:53.743 に答える
1

同じ構文を使用して要素を作成し、他のコンテンツを要素ではなくその.product_box:要素に追加するだけです。#content

var product_box = $('<div />', {'class' : 'product_box'}).appendTo('#content');
$('<div class="product_image"></div>').html('<a href="'+url+'"><img src='+urlZoomImage+' /></a>').appendTo(product_box);
$('<div class="product_title"></div>').html('<a href="'+url+'">'+title+'</a>').appendTo(product_box);
于 2012-11-14T12:22:36.453 に答える
0
var box = $('<div class="product_box"></div>');
var product_image = $('<div class="product_image"></div>').html('<a href="'+url+'"><img src='+urlZoomImage+' /></a>');
var produc_title = $('<div class="product_title"></div>').html('<a href="'+url+'">'+title+'</a>');

box.append(product_image,product_title).appendTo('.content');

参照

于 2012-11-14T12:22:55.710 に答える