ページからコンテンツを取得する iframe タグを動的に作成しています。取得元のページにコンテンツが含まれているかどうかを表示する前に確認するにはどうすればよいですか? iframe タグを生成する前に、最初にコンテンツを確認する必要がありますか?
<html><body></body></html>iframe ページが「 」であるため、「adContainer」が表示されないかどうかを確認するにはどうすればよいですか?
これまでに書いたコードの一部を次に示します...
function setAttributes(el, attrs) {
for(var key in attrs) {
el.setAttribute(key, attrs[key]);
}
}
// set ad iframe
function setAdiFrame(iWidth, iHeight, bookname) {
var randNum = Math.floor(Math.random()*1000000000);
var adFrame = document.createElement('IFRAME');
setAttributes(adFrame, {
"src": "http://www.foo.com/" + bookname + "/;cat=" + bookname + ";sz=" + iWidth + "x" + iHeight + ";ord=" + randNum,
"height": iHeight,
"width": iWidth,
"border": "0",
"scrolling": "no",
"allowtransparency": "true"
});
$('.ad').append(adFrame);
}
// ad container
var adContainer = $('.ad-container');
// check if ad container exist
if(adContainer.length > 0) {
// check if it's mobile
if(categorizr.isMobile) {
setAdiFrame(300, 400, 'bookname');
// otherwise, show desktop ad
} else {
setAdiFrame(728, 660, 'bookname');
}
// show ad once iframe page is loaded
adContainer.find('iframe').on('load', function() {
adContainer.css('display', 'block');
});
}
出力された adContainer のマークアップはそのままです。
<div class="ad-container" style="display: block;">
<div class="ad">
<a id="close" href="button:close"></a>
<iframe src="http://www.foo.com;bookname/;cat=bookname;sz=728x660;ord=849890967" height="660" width="728" border="0" scrolling="no" allowtransparency="true"></iframe>
</div>
</div>
IFrame ページの src 内に出力された html は「<html><head></head><body></body></html>」である可能性があります。だとしたら、adContainer を表示したくありません。