html 需要一个JavaScript解决方案来完全隐藏不同屏幕设备中的部分代码

42fyovps 于 2022-11-06 发布在 Java

关注(0)|答案(2)|浏览(123)

我试图在移动的、桌面和平板电脑上以正确的宽度集成此JavaScript部分，因此我编写了以下内容：
这显示在移动的上（在CSS中使用@media (min-width:...)）

<p align="center">News<script language="JavaScript" type="text/javascript" charset="iso-8859-1" src="//www.intopic.it/iframe.php?cat=fonti-rinnovabili&amp;rootcat=tecnologia&amp;type=2&amp;bgcolor=FFFFFF&amp;bdcolor=FFFFFF&amp;lcolor=666666&amp;font=1&amp;fontsize=13&amp;box=1050&amp;window=1"></script></p>

这显示在平板电脑上（在CSS中使用@media (min-width:...)）

<p align="center">News<script language="JavaScript" type="text/javascript" charset="iso-8859-1" src="//www.intopic.it/iframe.php?cat=fonti-rinnovabili&amp;rootcat=tecnologia&amp;type=2&amp;bgcolor=FFFFFF&amp;bdcolor=FFFFFF&amp;lcolor=666666&amp;font=1&amp;fontsize=13&amp;box=1050&amp;window=1"></script></p>

这会出现在桌面上（在CSS中使用@media (min-width:...)）

<p align="center">News<script language="JavaScript" type="text/javascript" charset="iso-8859-1" src="//www.intopic.it/iframe.php?cat=fonti-rinnovabili&amp;rootcat=tecnologia&amp;type=2&amp;bgcolor=FFFFFF&amp;bdcolor=FFFFFF&amp;lcolor=666666&amp;font=1&amp;fontsize=13&amp;box=1050&amp;window=1"></script></p>

这个问题是由于变量“box”实际上被浏览器读取了3次，因为移动的、平板和PC的每个代码部分都存在，并且浏览器都可以读取，它获得了最后一个框值，该值将宽度设置为250，这对于移动设备是可以的，但对于桌面和平板则不行，所以我需要一些东西来显示每次都动态地适合设备的唯一代码部分，我该怎么办？

Html

来源：https://stackoverflow.com/questions/53376983/need-a-javascript-solution-to-completely-hide-a-portion-of-code-in-different-scr

2条答案

按热度按时间

huwehgph1#

我解决了写这个：

<script type="text/javascript">
  if(window.innerWidth>1024){
    document.write('\x3Cscript language="JavaScript" type="text/javascript" charset="iso-8859-1" src="//www.intopic.it/iframe.php?cat=fonti-rinnovabili&amp;rootcat=tecnologia&amp;type=2&amp;bgcolor=FFFFFF&amp;bdcolor=FFFFFF&amp;lcolor=666666&amp;font=1&amp;fontsize=13&amp;box=1024&amp;window=1"\x3C/script>');
  }else if(window.innerWidth>600){document.write('\x3Cscript language="JavaScript" type="text/javascript" charset="iso-8859-1" src="//www.intopic.it/iframe.php?cat=fonti-rinnovabili&amp;rootcat=tecnologia&amp;type=2&amp;bgcolor=FFFFFF&amp;bdcolor=FFFFFF&amp;lcolor=666666&amp;font=1&amp;fontsize=13&amp;box=600&amp;window=1"\x3C/script>');}
  else{
  document.write('\x3Cscript language="JavaScript" type="text/javascript" charset="iso-8859-1" src="//www.intopic.it/iframe.php?cat=fonti-rinnovabili&amp;rootcat=tecnologia&amp;type=2&amp;bgcolor=FFFFFF&amp;bdcolor=FFFFFF&amp;lcolor=666666&amp;font=1&amp;fontsize=13&amp;box=250&amp;window=1"\x3C/script>');}
  </script>

赞(0）回复(0）举报 2022-11-27

axr492tv2#

试试看：

var source_url, 
    script_element = document.createElement("script");

if(window.innerWidth > 1024) {
   script_element.src = "1024_script_source_url";
   console.log('loaded 1024 url, window width', window.innerWidth);
} else if (window.innerWidth > 600) {
   script_element.src = "600_script_source_url";
   console.log('loaded 1024 url, window width', window.innerWidth);
} 

document.head.append(script_element);

alert('done, window width' + window.innerWidth);

您可能希望订阅窗口大小调整事件，以便...

window.onresize = function(event) {
//do something
};

赞(0）回复(0）举报 2022-11-27

我来回答

html 需要一个JavaScript解决方案来完全隐藏不同屏幕设备中的部分代码

2条答案

相关问题

热门标签

最新问答