格之間添加HTML使用jQuery

我有這樣的代碼：格之間添加HTML使用jQuery

jQuery('.post-single-content').addClass('padT');    
jQuery('.post-single-content').css("padding-top", "40px");

它基本上把它轉換：

<div class="post-single-content">

成這樣：

<div class="post-single-content padT" style="padding-top: 40px;">

不過，我試圖改變代碼，因此它將它轉換成如下形式：

<div class="post-single-content"> 
<a href="../index.html"><img src="../spacer.jpg"></a>

有人能告訴我如何做到這一點。我試過用here的幾個例子，但沒有運氣。任何幫助，將不勝感激。

來源

2015-04-18 Ron

使用append，llike這樣：

$('.post-single-content').append('<a href="../index.html"><img src="../spacer.jpg"></a>');

CODEPEN DEMO

來源

2015-04-19 00:11:20

謝謝！這行得通：）。我最終使用.prepend而不是.append來讓它出現在div標籤的開頭。 – Ron

可以（）

$(".post-single-content").after('<a href="../index.html"><img src="../spacer.jpg"></a>');

該解決方案的。員額單內容DIV之後增加元素後，使用該功能。您應該使用的append（）：

$(".post-single-content").append('<a href="../index.html"><img src="../spacer.jpg"></a>');

來源

2015-04-19 00:08:39

該解決方案將增加股利後的新內容，並在它內部沒有。您可能想要使用append。 – mcserep

你說得對。謝謝。 –

您可以使用jQuery來動態地創建新的DOM對象，並追加他們現有的：

var div = $('.post-single-content'); 
var link = $('a').attr('href', '../index.html'); 
var image = $('img').attr('src', '../spacer.jpg'); 
div.append(link.append(image));

來源

2015-04-19 00:08:58 mcserep

如果它只是一個單獨的div你試圖操縱add一個ID。

<div id="divToChange" class="post-single-content padT" style="padding-top: 40px;"></div>

然後創建元素和追加（略比其他解決方案更詳細，但絕不會傷害看到一個不同的方式）。

$(document).ready(function() { 

    var targetDiv = $('#divToChange'); 

    var aTag = document.createElement('a'); 
    aTag.href = '../index.html'; 

    var imgTag = document.createElement('img'); 
    imgTag.src = '../spacer.jpg'; 

    $(imgTag).appendTo(aTag); 
    $(aTag).appendTo(targetDiv); 
});

結果如下：

<div id="divToChange" class="post-single-content padT" style="padding-top: 40px;"><a href="../index.html"><img src="../spacer.jpg"></a></div>

來源

2015-04-19 00:18:31 SSharp

格之間添加HTML使用jQuery

回答

相關問題