jQueryMobileの上にiPhone/Androidビルド用のWebサイトを作成しました。これは、ページの更新がないことを意味します。代わりに、すべてのサイトが1つのページにレンダリングされ、URLの最後にあるハッシュタグのみが変更されてページ遷移が発生します。
次に、広告パートナーの1つからJavaScriptベースの広告タグを埋め込みたいと思いました。このスクリプトコードは、広告(画像またはjsベースの広告)を経由document.write()
してサイトに書き込みます。
例:
<script>
for (var i in adTags){
var adTag = adTags[i];
var jscode = adTag.jscode; // Contains document.write() call in <script> Block
var container = $("#" + adTag.containerId);
container.html(jscode);
}
</script>
ここでの問題は、document.write()
ページが更新される静的サイトではうまく機能しますが、HTMLドキュメントが完全に読み込まれた後の動的呼び出しによってタグdocument.write()
が空になるため、1ページのWebサイトが完全に破壊されることです。<body>
例:
以前のHTMLが次のようになっていると仮定します。
<html>
<head>
<title>Foo</title>
</head>
<body>
Hello World
<div id="ad1"></div>
<div id="ad2"></div>
</body>
</html>
上記のJavaScriptコードを実行した後、私の体は次のようになります。
<body>
<img src="http://www.adserver.com/foo.png">
</body>
ご覧のとおり、document.write()
のすべてのコンテンツを完全に削除します<body>
。それは耐えられません。
だから、私はこの問題を解決しますか?
注:私はすでに次のように上書きしてこれを回避しようとしましたdocument.write()
:
<script>
var currentContainer = null;
document.write = function(code){
currentContainer.html(code);
}
for (var i in adTags){
var adTag = adTags[i];
var jscode = adTag.jscode; // Contains document.write() call in <script> Block
var container = $(adTag.containerId);
currentContainer = container;
eval(jscode);
}
</script>
さて、これは一見うまく機能しますが、ここでの問題は、AdTagの呼び出しが次のdocument.write()
ような別のJavaScriptをロードすることです。
<script src="http://www.adserver.com/more.js"></script>
このjsファイルにはdocument.write()
、カスタム(上書きされた)document.write()
関数を再度呼び出す別の呼び出しが含まれています。問題は、その間にfor()ループが続行され、変数currentContainerのコンテンツが変更された後、カスタムdocument.write()
関数が新しいコンテンツを間違ったdivコンテナーに書き込むことです。