Question

jQuery的html()和append()之间有什么区别？因为如果我使用append()，它会在下一行显示我的数据，而如果我使用html()，它只会覆盖显示的第一个数据......

现在我想要的是html()的功能，但是在下一行显示它而不是覆盖显示的先前数据，如果之前的数据已经显示，它只会突出显示它而不是将其附加到下一行是我的javascript代码

html2 += '<div class="rightcontainer">';
html2 += '<img id="productimage" src="src/images/retrofit.png" onclick="DisplayProfileCard();"/>';
html2 += '<div id="imagedetail">';
html2 += '<span class="details">Product Type:' + flsSites[index].serial_number +'</span>';
html2 += '<span class="details">Version / Size <img class="row_one_icon lightbulb_icon" id="lightbulb" src="src/images/lightbulb1.png" onClick="LightBulb()" /><img id="convert" class="row_one_icon arrow_icon" src="src/images/arrow_Off.png" onClick="Conversion()"/><img id="lightning" class="row_one_icon" src="src/images/lightningOff.png" onClick="Lightning()"/><img id="bullseye" class="row_one_icon bullseye" src="src/images/bullseye_off.png" onClick="BullsEye()"/></span>';
html2 += '<span class="details">Estimated annual Spend <img class="row_one_icon ribbon" src="src/images/ribbon1.png"/><img class="row_one_icon map" src="src/images/map1.png"/><img class="row_one_icon paper_stack" id="paper" src="src/images/paper_stack_Off.png" onclick="PaperStack()"/><img class="row_one_icon chain" id="chain" src="src/images/chain_Off.png" onClick="ChainLink()"/></span>';
html2 += '<span class="details">Site name / manufacturer</span>';
html2 += '<span class="details">Selling Sales Eng</span>';
html2 += '</div>'
html2 += '</div>';
$('#resultcontainer').append(html2);
$('.rightcontainer').eq($(this).index()).addClass('background');

谢谢

Answer 1

$(el).html()替换选择器内的所有内容。

 <div class="el">
      <!-- Everything here gets replaced -->
 </div>

$(el).append()将选择器置于最后。

 <div class="el">
      [...]
      <!-- appends it here -->
 </div>

$(el).prepend()将选择器置于开头。

 <div class="el">
      <!-- preprend it here -->
      [...]
 </div>

$(el).before()在选择器之前放置。

 <!-- appends it here -->
 <div class="el">
      [...]
 </div>

$(el).after()在选择器之后放在外面。

 <div class="el">
      [...]
 </div>
 <!-- appends it here -->

jQuery中append和html之间的区别

1 个答案: