Fatal编程技术网
  • javascript/
  • Javascript 如何根据浏览器窗口的宽度输出HTML？

Javascript 如何根据浏览器窗口的宽度输出HTML？

javascript jquery html

Javascript 如何根据浏览器窗口的宽度输出HTML？,javascript,jquery,html,Javascript,Jquery,Html,我制作了这个javascript并尝试过，但从未奏效。 它必须显示广告横幅。 如果我把这个iframe放在javascript标记的外侧，它可以正常工作，但我确实把它放在javascript标记的内侧，因为iframe将取决于浏览器窗口的宽度 我如何才能使这项工作 <head> <script type="text/javascript"> width = jQuery(".pagenator").width(); if (width > 730)

我制作了这个javascript并尝试过，但从未奏效。
它必须显示广告横幅。
如果我把这个iframe放在javascript标记的外侧，它可以正常工作，但我确实把它放在javascript标记的内侧，因为iframe将取决于浏览器窗口的宽度

我如何才能使这项工作

<head>

<script type="text/javascript">
    width = jQuery(".pagenator").width();
    if (width > 730) {
        <iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='728' height='90' src='http://foofoofoofootest.com/adspot.aspx?id=21442?'>
        </iframe>
    } else if (width > 470) {
        <iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='468' height='60' src='http://foofoofoofootest.com/adspot.aspx?id=21443?'>
        </iframe>
    } else if (width > 255) {
        <iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='250' height='250' src='http://foofoofoofootest.com/adspot.aspx?id=21444?'>
        </iframe>
    } else {
        <iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='200' height='200' src='http://foofoofoofootest.com/adspot.aspx?id=21445?'>
        </iframe>
    }       
</script>   


<head>

<body>



</body>

</html>


width=jQuery（“.pagenator”）.width（）；
如果（宽度>730）{
}否则，如果（宽度>470）{
}否则，如果（宽度>255）{
}否则{
}
更新

<body>

<script type="text/javascript">
    var TheHTML = "";
    width = jQuery(".pagenator").width();
    if (width > 730) {
        TheHTML = "<iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='728' height='90' src='http://foofoofoofootest.com/adspot.aspx?id=21442'></iframe>";
    } else if (width > 470) {
        TheHTML = "<iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='468' height='60' src='http://foofoofoofootest.com/adspot.aspx?id=21443'></iframe>";
    } else if (width > 255) {
        TheHTML = "<iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='250' height='250' src='http://foofoofoofootest.com/adspot.aspx?id=21444'></iframe>";
    } else {
        TheHTML = "<iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='200' height='200' src='http://foofoofoofootest.com/adspot.aspx?id=21445'></iframe>";
    }
    $("#frameHolder").html(TheHTML);        
</script>           


<div id="frameHolder"></div>


</body>


var TheHTML=“”；
width=jQuery（“.pagenator”）.width（）；
如果（宽度>730）{
TheHTML=“”；
}否则，如果（宽度>470）{
TheHTML=“”；
}否则，如果（宽度>255）{
TheHTML=“”；
}否则{
TheHTML=“”；
}
$（“#frameHolder”）.html（TheHTML）；
您需要将HTML添加到DOM中；像这样：

var TheHTML = "";
var width = jQuery(".pagenator").width(); // add a var, otherwise you're creating a global
if (width > 730) {
     TheHTML = "<iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='728' height='90' src='http://foofoofoofootest.com/adspot.aspx?id=21442?'></iframe>";
} else if (width > 470) { ....

$('ContainerOfTheIframe').html(TheHTML);

var TheHTML=”“；
var width=jQuery（“.pagenator”）.width（）；//添加一个var，否则您将创建一个全局变量
如果（宽度>730）{
TheHTML=“”；
}如果（宽度>470）{。。。。
$（'ContainerOfTheIframe'）.html（TheHTML）；
这应该是可行的。还要确保脚本运行时jQuery可用（即，将jQuery.js文件的引用放在脚本上方）。

您需要将HTML添加到DOM中；如下所示：

var TheHTML = "";
var width = jQuery(".pagenator").width(); // add a var, otherwise you're creating a global
if (width > 730) {
     TheHTML = "<iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='728' height='90' src='http://foofoofoofootest.com/adspot.aspx?id=21442?'></iframe>";
} else if (width > 470) { ....

$('ContainerOfTheIframe').html(TheHTML);

var TheHTML=”“；
var width=jQuery（“.pagenator”）.width（）；//添加一个var，否则您将创建一个全局变量
如果（宽度>730）{
TheHTML=“”；
}如果（宽度>470）{。。。。
$（'ContainerOfTheIframe'）.html（TheHTML）；
这应该是可行的。还要确保脚本运行时jQuery可用（即，将jQuery.js文件的引用放在脚本上方）。

试试这个

var pagewidth = jQuery(".pagenator").width(),
pageId = 0;
  if (pagewidth > 730) {
  pageId = 21442;
} 
else if (pagewidth > 470) {
  pageId = 21443;
}
else if (pagewidth > 255) {
  pageId = 21444;
}
else {
  pageId = 21445;
}    
$('body').html("<iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='728' height='90' src='http://foofoofoofootest.com/adspot.aspx?id='" + pageId + "'?'></iframe>");

var pagewidth=jQuery（“.pagenator”）.width（），
pageId=0；
如果（页面宽度>730）{
pageId=21442；
} 
否则如果（页面宽度>470）{
pageId=21443；
}
否则如果（页面宽度>255）{
pageId=21444；
}
否则{
pageId=21445；
}    
$（'body'）.html（“”）；
试试这个

var pagewidth = jQuery(".pagenator").width(),
pageId = 0;
  if (pagewidth > 730) {
  pageId = 21442;
} 
else if (pagewidth > 470) {
  pageId = 21443;
}
else if (pagewidth > 255) {
  pageId = 21444;
}
else {
  pageId = 21445;
}    
$('body').html("<iframe frameborder='0' allowtransparency='true' marginheight='0' marginwidth='0' scrolling='no' width='728' height='90' src='http://foofoofoofootest.com/adspot.aspx?id='" + pageId + "'?'></iframe>");

var pagewidth=jQuery（“.pagenator”）.width（），
pageId=0；
如果（页面宽度>730）{
pageId=21442；
} 
否则如果（页面宽度>470）{
pageId=21443；
}
否则如果（页面宽度>255）{
pageId=21444；
}
否则{
pageId=21445；
}    
$（'body'）.html（“”）；
你为什么不直接使用
媒体查询
和
显示：无；
然后使用
显示：块；
。你不需要使用
JS
来做一些可以用
CSS
做控制台的事情。log（）在width变量上，查看其中的内容，我猜它会返回一个字符串。我认为您需要将此逻辑推送到iframe的源代码中，而不是内容的保持器中。然后使用媒体静音为什么不使用
媒体查询
和
显示：无；
然后
显示：块；
。您可以这样做吗不需要使用
JS
就可以用
CSS
do a console.log（）完成一些事情在你的宽度变量上，看看里面有什么，我猜它会返回一个字符串。我认为你需要将这个逻辑推送到iframe的源代码中，而不是内容的持有者中。然后使用media quieriesThanks。你能把html的结果推到前面吗？如果是，怎么做？你的代码似乎会将结果输出到元素中名称为“ContainerOfTheIframe”作为ID的？您需要将iframe放入某些内容中。我将转到DOM并在希望iframe进入的位置添加一个空div，并为该div提供一个ID。然后将此ID替换为$（“ContainerOfTheIframe”）在那里使用div可能更好。如果您想在结束之前添加iframe，那么只需将其添加到DOM中，然后在javascript中更改：$（'#TheIframe'）.html（TheHTML）；注意，您还可以使用.append（）但是我更喜欢添加一个空div，这样使用HTML源代码的人就可以在HTML中看到空标记。谢谢。你能把HTML的结果输出到前面吗？如果是，怎么做？你的代码似乎将结果输出到了名为“ContainerOfTheIframe”作为ID的元素中？你需要把iframe放入一些东西中。我会转到DOM然后在希望iframe进入的位置添加一个空div，并给这个div一个ID。然后将这个ID替换为$（'ContainerOfTheIframe'）。在那里使用div可能更好。如果您想在结束之前添加iframe，那么只需将它添加到DOM中，然后在javascript中更改它：$（'TheIframe'）.html（TheHTML）；请注意，您也可以使用.append（），但我更喜欢添加一个空div，以便使用HTML源代码的人可以在HTML中看到空标记。谢谢！就是这样！！！我在javascript下面有一部分！！你让我注意到了谢谢！！！谢谢！就是这样！！！我在javascript下面有一部分！！你让我注意到了谢谢！！！