用jquery將html添加到html頁面

我想添加一個javascript google廣告，但是我無法將javascript插入到使用jquery的div中。我嘗試用這個測試來模擬我的問題，它使用了我在stackoverflow上發現的一些建議，但它不起作用。用jquery將html添加到html頁面

我想<script type='text/javascript'>document.write('hello world');</script>被插入到div中，並且在標籤_1和標籤__2之間顯示「hello world」。

下面是代碼：

<html> 
    <head> 
     <script type="text/javascript" src="jquery.js"></script> 
     <script type="text/javascript"> 
     $(document).ready(function() { 
     var str="<script type='text/javascript'>document.write('hello world');"; 
     str+="<"; 
     str+="/script>"; 

     $('#insert_here').append(str); 
     }); 
     </script> 
    </head> 
    <body> 
     tag_1<br/> 
     <div id="insert_here"> 
     </div> 
     tag_2<br/> 
    </body> 
</html>

坦克爲您解答，

盧卡斯

來源

2010-08-05 Lucas

我想出了一個很好的解決方案：

上的任何地方插入您的谷歌Adsense代碼你的頁面 - 例如如果您的CMS只允許您將其放在右側，請將其粘貼在那裏。
圍繞它與display:none風格
添加一些jQuery代碼來移動div到你想要的位置。

由於javascript已經運行，所以將腳本塊移到任何你想要的位置都沒有問題。

例如如果您希望在您的博客中散佈2塊谷歌廣告（比如在第1段和第4段之後），那麼這是完美的。

下面是一些示例代碼：

<div id="advert1" style="display:none"> 
<div class="advertbox advertfont"> 
    <div style="float:right;"> 
     <script type="text/javascript"><!-- 
     google_ad_client = "pub-xxxxxxxxxxxxxxxxx"; 
     /* Video box */ 
     google_ad_slot = "xxxxxxxxxxxxxxxxx" 
     google_ad_width = 300; 
     google_ad_height = 250; 
     //--> 
     </script> 
     <script type="text/javascript" 
     src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
     </script> 
    </div> 
</div> 
</div> 

<script> 
$(document).ready(function() { 

$('#advert1').appendTo("#content p:eq(1)"); 
$('#advert1').css("display", "block"); 

}); 
</script>

附： #content恰好是內容在我的CMS（Squarespace）上啓動的位置，因此您可以用CMS中的任何內容替換它。這是一種享受，不會破壞Google ToS。

來源

2012-02-28 17:17:52

Adsense是非常嚴格的，顯示：沒有可能得到即使這是無害的，你也禁止了。我不會嘗試Adsense廣告的任何聰明之處。 – 2013-10-13 07:21:30

好點 - 不會破壞解決方案 - 只是刪除顯示：無 - 您仍然可以使用此解決方案加載廣告並將它們移動到所需的位置。 – 2013-10-15 08:25:38

不能使用document.write後的頁面加載完畢。取而代之的是，只需插入要在寫入內容。

<script type="text/javascript"> 
    $(function() { // This is equivalent to document.ready 
     var str="hello world"; 
     $('#insert_here').append(str); 
    }); 
</script>

來源

2010-08-05 18:47:49

見my answer to Are dynamically inserted <script> tags meant to work?爲什麼不能使用的innerHTML，其中jQuery的功能映射時，通過一個HTML字符串，插入腳本元素。 document.write也將失敗when used after the document has been fully parsed。

要解決此問題，您將不得不使用DOM函數將元素插入到div中。 Google廣告是iframe，因此通常是尋找iframe代碼並附加代碼。

要正確插入腳本元素，你需要使用DOM的功能，例如：

var txt = 'alert("Hello");'; 
var scr = document.createElement("script"); 
scr.type= "text/javascript"; 

// We have to use .text for IE, .textContent for standards compliance. 
if ("textContent" in scr) 
    scr.textContent = txt; 
else 
    scr.text = txt; 

// Finally, insert the script element into the div 
document.getElementById("insert_here").appendChild(scr);

來源

2010-08-05 18:51:01

感謝您的諮詢！現在我可以插入Javascript但我無法執行它。你有解決方案嗎？這裏是我的代碼：

– Lucas 2010-08-05 19:57:09

盧卡斯：你還在試圖插入使用腳本* *的innerHTML，這是不可能的。你需要使用* createElement *函數，我已經給我的答案添加了一個例子。 – 2010-08-05 20:13:43

非常感謝！自昨天起我就一直在嘗試解決這個問題，現在它可以工作。再次感謝=） – Lucas 2010-08-06 16:48:24

用jquery將html添加到html頁面

回答

相關問題