如何從XHTML中的Document.Write刪除Div和Img標簽

Question

我想做的是在足夠大的屏幕上顯示全屏背景圖像，並且該圖像可以在大多數瀏覽器上使用，但在其他瀏覽器上卻引起問題。 我通過W3驗證程序運行它，並說XHTML在document.write中不支持Div和Img標記。 沒有document.write的情況下，我該如何編碼，使其通過驗證程序，而不會在某些瀏覽器上引起錯誤？

<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jquery.fullscreenBackground.js"></script>
<script type="text/javascript">
$(document).ready(function () {
        $("#background-image").fullscreenBackground();
    });
</script>

            <script type="text/javascript">
var viewPortWidth = $(window).width();
var viewPortHeight = $(window).height();
if (viewPortHeight >= 300 && viewPortWidth >= 400) {
document.write("<div id='background-image'><img src='BGLarge.gif' alt='background' width='1920' height='1080' ></div>");
}
else {
document.write("");
}
</script>

Answer 1

使用jquery前置元素： http : //api.jquery.com/prepend/ 。

這應該工作。 或者，您可以更改您的文檔類型。

Answer 2

if (viewPortHeight >= 300 && viewPortWidth >= 400) {
  $('body').prepend('<div id="background-image"><img src="http://thetylerpress.com/new/BGLarge.gif" alt="background" width="1920" height="1080" ></div>');
}

您將不需要else語句

Answer 3

知道哪個瀏覽器會引發錯誤將很有用。 無論如何，為什么不使用jQuery實現您想要的？

$('body').prepend(
    $('<div></div>')
        .attr('id', 'background-image')
        .html("<img src='http://thetylerpress.com/new/BGLarge.gif' alt='background' width='1920' height='1080' >")
);​

實時示例： http ： //jsfiddle.net/Wyd43/