jQueryでdocument.write() の含まれるスクリプトコードを画面に追加する方法

portfolio-402179_1920

問題となるコード例

jQueryでdocument.write() の含まれるスクリプトコードを画面に追加する場合、document.write() で出力した内容が画面全体に上書きされてしまう現象が発生します。

See the Pen jquery-document-write-ng by Yoshitaka Ise (@isystk) on CodePen.

解決するためのコード例

DOMに追加する直前で、`document.write` の中身を書き換えてしまうことで、この現象を回避することが出来るようになります。


<script type="text/javascript">
$(function() {
	var dfpBannerHtml = [];
	document._write=document.write; //document._writeに代入する
	document.write=function(s){
		dfpBannerHtml.push(s);
	};
	$('.result li').each(function(i) {
		if ((i+1) % 3 === 0) {
			eval($('#dfp-banner script').text())
			$(this).after(dfpBannerHtml);
			dfpBannerHtml = [];
		}
	});
	document.write=document._write;  //document.writeに戻す
})
</script>

See the Pen VwaGbNX by Yoshitaka Ise (@isystk) on CodePen.

コメントを残す

入力エリアすべてが必須項目です。メールアドレスが公開されることはありません。

内容をご確認の上、送信してください。