用iframe替換所有<a> hrefs div

我正在嘗試在頁面加載或頁面加載之前讀取hrefs列表，並將所有hrefs轉換爲指向href用於指向的位置的iframe至。例如：用iframe替換所有<a> hrefs div

藉此：

<div id="maincontent" > 
<p> </p> 
<a href="http://page1.html">page1.html</a><br /> 
<br /> 
<a href="http://page2.html">page1.html</a><br /> 
<br /> 
<a href="http://page3.html">page1.html</a><br /> 
<br /> 
</div>

並將其替換：

<div id="maincontent" > 
<iframe src="http://page1.html"></iframe> 
<iframe src="http://page2.html"></iframe> 
<iframe src="http://page3.html"></iframe> 
</div>

我也希望能夠同時我在它刪除Br和p標籤。有人可以告訴我如何將內容讀入jQuery，然後以我的新格式將其重寫到頁面中？非常感謝您的專業知識！

來源

2014-03-06 user3139728

你可以首先得到該內容到一個變量。

E.g. var $ maincontent = $（'＃maincontent'）;

然後使用find來獲得匹配「a」標籤的所有元素。

var $links = $maincontent.find("a");

清潔的存在DIV的所有元素。

$maincontent.html("");

然後通過鏈接並通過標籤創建一個iframe。

$links.each(function(){ 
    var href = $(this).prop("href"); 
    var $iframe = $("<iframe>").prop("src",href); 
    $maincontent.append($iframe); 
});

你也可以在每個創建html的字符串中創建html並替換原始的html。在maincontent div。

來源

2014-03-06 22:29:11 Scriptlabs

這是完美的，你能向我解釋你清除存在的div中的所有元素？它工作完美，但我不瞭解後端。你也可以解釋iframe結束標籤的位置嗎？非常感謝！ – user3139728

Sry對於最近的回覆，主要想法是：使用.find（）從主內容中僅獲取標籤。之後.html（「」）將插入一個空字符串到你的主div。函數.each（）將遍歷所有找到的鏈接。循環內$（this）引用鏈接。我們得到屬性「href」並用它來創建一個空的iframe（關閉標籤將被jquery插入）。我們再次使用prop（）將src屬性寫入創建的iframe jquery元素。最後，新創建的帶有src的jquery iframe元素被「附加」到空的maincontent div中。 – Scriptlabs

喜歡的東西：

$("#maincontent a").each(function() { 
    var src = this.href; 
    $(this).replaceWith("<iframe src='" + src + "' />"); 
});

來源

2014-03-06 22:14:25 tymeJV

你應該使用'this.getAttribute（'href'）'而不是http://stackoverflow.com/questions/6977049/this-href-vs-this-attrhref –

$('#maincontent a').each(function(){ 

    var href= $(this).attr('href'); 
    var iframe = $('<iframe>', {src:href}); 
    $(this).replaceWith(iframe); 

});

來源

2014-03-06 22:16:07

用iframe替換所有<a> hrefs div

回答

相關問題