jQueryを使用してDIVにJavascriptコードを挿入する

Question

これは私がレスポンシブサイトで働いているため、私は可能な限り最良の方法でAdSenseを処理しようとしています。私がしたいのは、ブラウザの幅が533px未満の場合にのみjQueryを使用してAdSenseのコードを追加することです。こうすることで、ウィンドウに適切にフィットし、レイアウトを破らない小さな広告を表示することができます。私はAdsenseのjavascriptを追加していくつかの問題を抱えている。これは動作します：

(function($){ 
//detect the width on page load 
$(document).ready(function(){ 
var current_width = $(window).width(); 
//do something with the width value here! 
if(current_width < 533){ 
     $('.ads').prepend("THIS IS WHERE I WANT THE ADSENSE CODE TO GO"); 
} 
}); 

しかし、私はこれを置き換えるために、私のAdsenseのコードが含まれ、私はADSENSEはどこへ行きたいか、そうでないです。これは、AdSenseコードです：

<script type="text/javascript"><!-- 
google_ad_client = "ca-pub-1234567890"; 
/* Test Ad */ 
google_ad_slot = "1234567890"; 
google_ad_width = 250; 
google_ad_height = 250; 
//--> 
</script> 
<script type="text/javascript" 
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script> 

私も.htmlのファイルにAdsenseのJavaScriptコードが含まれるとの.htmlと.jsファイルのためjQuery.getとjQuery.getScriptを使用することを試みました。私はそれを働かせることができません。

私は単純なPHPヘッダー検出でこれを行うことができますが、デバイスの種類ではなく幅に基づいて広告を表示したいと考えています。

これはどのように行うことができますか？

（前の質問に対する回答として再掲）

Answer 1

問題は、GoogleがAdSense ajaxを実際にサポートしていないことです。 adsenseコードを含める通常の方法は、適切なコンテンツをレンダリングするために、そのページが存在するページのURLを使用します。

ここで、特定のURLにAdSenseのコードを減らすことができたとします。

// note, this url is just a suggestion, not something that will likely work 

var url = 'http://pagead2.googlesyndication.com/pagead/ads?client=ca-pub-1234567890&ad_slot=1234567890&ad_width=250&ad_height=250'; 

var adsContainer = $('.ads'); // though, if there's only one, use id, not class 

$.ajax({ 
type:'GET', 
    url:url, 
    async:true, 
    success:function(html) { 
     adsContainer.html(html); 
     return false; 
    }, 
    error: function(html) { 
     adsContainer.html('SOME DEFAULT AD MESSAGE'); 
     return false; 
    } 
}); 

しかし、これはほぼ確実にGoogleと問題を起こすようなものだと思います。

https://developers.google.com/adsense-for-ajax/

しかし、それは今、 "利用不可" である：

GoogleがAdSenseのAjaxのプログラムを持っていました。あなたのコードを外部の.htmlファイルや.phpファイルとあなた自身のサーバー上のajaxに入れることができないのは、javascriptがajax呼び出しによってクライアント側のエンジンによって実行されないということです。あなたはJavaScriptのエンジンによって既に解釈されたページに生のJavaScriptを注入しています。

.htmlファイルを提供するためにnode.jsや何らかのサーバーサイドのJavaScriptパーザを使用できますか？多分、この問題を解決するには多くのことがあります。

私のアドバイスは、大きなページに積み重ねると見栄えの良い複数の小さな広告を組み込むことです。小さなページにまとめて並べるとタイル表示します。

Answer 2

私はこれが機能するかどうかわからないかどうか、それはショットの価値がある：

/* these should be global */ 
google_ad_client = "ca-pub-1234567890"; 
/* Test Ad */ 
google_ad_slot = "1234567890"; 
google_ad_width = 250; 
google_ad_height = 250; 

$(function(){ 
    //detect the width on page load 
    var current_width = $(window).width(); 
    //do something with the width value here! 
    if(current_width < 533){ 
     $.getScript('http://pagead2.googlesyndication.com/pagead/show_ads.js'); 
    } 
}); 

Answer 3

あなたは、外部の.jsを船積みみましたこのような？

var script = document.createElement('script'); 
    script.src = 'http://pagead2.googlesyndication.com/pagead/show_ads.js'; 
    script.type = 'text/javascript'; 
    var head = document.getElementsByTagName("head")[0]; 
    head.appendChild(script);