輸出文本不正確的格式顯示

Question

這裏是JavaScript我用的動畫內容的滑塊（淡入淡出效果）我從數據庫中讀取：

<script language="javascript"> 
jQuery(document).ready(function() 
{ 
    var terms = ["span_1","span_2"]; 
    var i = 0; 

    function rotateTerm() { 
     jQuery("#text-content").fadeOut(200, function() { 
      jQuery(this).text(jQuery('#text-slider .'+terms[i]).html()+i).fadeIn(200); 
     }); 
     jQuery("#title-content").fadeOut(200, function() { 
      jQuery(this).text(jQuery('#title-slider .'+terms[i]).html()+i).fadeIn(200); 
      i == terms.length - 1 ? i=0 : i++; 
     }); 
    } 
    rotateTerm(); 
    setInterval(rotateTerm, 1000); 
}); 
</script> 

這裏是PHP代碼我使用：

<?php 
    if (!empty($testLst)) :  
     $num=1; 
     foreach($testLst as $key=>$item): 
      $item->slug = $item->id; 
      $item->catslug = $item->catid ; 

?><div id="hidden-content" style="display:none;">  
    <div id="title-slider"> 
     <span class="<?php echo 'span_'.$num; ?>"> 
      <h4><a href="<?php echo JRoute::_(ContentHelperRoute::getArticleRoute($item->id, $item->catid)); ?>"> 
       <?php echo $item->title; ?></a> 
      </h4> 
     </span> 
    </div> 
<div id="text-slider"> 
    <span class="<?php echo 'span_'.$num; ?>"> 
     <p> 
      <?php 
       $concat=array_slice(explode(' ',$item->introtext),0,20); 
       $concat=implode(' ',$concat); 
       echo $concat."..."; 
      ?> 
     </p> 
    </span> 
</div></div> 
<a href="<?php echo JRoute::_(ContentHelperRoute::getArticleRoute($item->id, $item->catid)); ?>" title="Learn more" class="learnMore">Learn more &gt;&gt;</a></p> 
<?php 
    $num++; 
    endforeach; 
    endif; 
?> 

<div id="title-content"> 
</div> 
<div id="text-content"> 
</div> 

和here is a JSFiddle page再現我想要做的事情。

我的問題是，我得到的數據仍然有HTML標籤，但是我希望輸出具有我的CSS樣式。

Answer 1

您可以克隆節點，並將其設置爲目標元素的新內容，以便將所有內容都保存在jQuery對象中，但個人而言，我會使用.outerHTML屬性。

我有updated your fiddle向您展示我的意思：我已將.text(...set content here)更改爲.html()，因爲我們正在注入HTML內容。然後，我在選擇器的末尾添加了[0]，以返回原始的元素引用，該元素引用可以訪問元素所具有的所有標準JS屬性和方法，然後繼續並取出outerHTML ... easy-peasy