从脚本更改src，具体取决于浏览器的大小

Question

我的网站有点问题

我正在尝试根据脚本在div内的浏览器大小来更改脚本的src属性

这是代码的样子

 <div style="margin: 15px 0px 0px; display: inline-block; text-align: center;"> <script id="world" type="text/javascript" src="http://localtimes.info/world_clock2.php?&cp1_Hex=ffd700&cp2_Hex=000000&cp3_Hex=000000&fwdt=72&ham=0&hbg=0&hfg=0&sid=0&mon=0&wek=0&wkf=0&sep=0&widget_number=21000&lcid=SNXX0006,USNY0996,UKXX0085,ASXX0112,HKXX0001"></script> </div> 

我正在尝试从脚本中更改src，该脚本本身包含要根据浏览器大小更改的小部件的宽度（脚本中的fwdt值）

我正在尝试使用以下代码解决我的问题

    <script>
  var w = window.innerWidth;
  if (w>991) {
    document.getElementById("demo").innerHTML = "Width: " + w ;
    $('#world').attr('src','http://localtimes.info/world_clock2.php?&cp1_Hex=ffd700&cp2_Hex=000000&cp3_Hex=000000&fwdt=200&ham=0&hbg=0&hfg=0&sid=0&mon=0&wek=0&wkf=0&sep=0&widget_number=21000&lcid=SNXX0006,USNY0996,UKXX0085,ASXX0112,HKXX0001');
  }
  else if (w<991) {
    document.getElementById("demo").innerHTML = "Width: " + w ;
    $('#world').attr('src','http://localtimes.info/world_clock2.php?&cp1_Hex=ffd700&cp2_Hex=000000&cp3_Hex=000000&fwdt=100&ham=0&hbg=0&hfg=0&sid=0&mon=0&wek=0&wkf=0&sep=0&widget_number=21000&lcid=SNXX0006,USNY0996,UKXX0085,ASXX0112,HKXX0001');
  };
</script>

但是，我的代码对脚本src没有任何作用

我从互联网上发现的是创建脚本本身，它使用appendChild ...但是，appendChild通过使用标记名来工作，在我的情况下，我的脚本是div的子代...

有办法解决吗？

新

    <script>
  var w = window.innerWidth;

  if (w>991) {
    document.getElementById("demo").innerHTML = "Width " + w;
    $('#asd').append('<script type=\"text\/javascript\" src=\"http:\/\/localtimes.info\/world_clock2.php?&cp1_Hex=ffd700&cp2_Hex=000000&cp3_Hex=000000&fwdt=100&ham=0&hbg=0&hfg=0&sid=0&mon=0&wek=0&wkf=0&sep=0&widget_number=21000&lcid=SNXX0006,USNY0996,UKXX0085,ASXX0112,HKXX0001\"><\/script>');
  }
  else if (w<991) {
    document.getElementById("demo").innerHTML = "Width " + w;
    $('#asd').append('<script type=\"text\/javascript\" src=\"http:\/\/localtimes.info\/world_clock2.php?&cp1_Hex=ffd700&cp2_Hex=000000&cp3_Hex=000000&fwdt=200&ham=0&hbg=0&hfg=0&sid=0&mon=0&wek=0&wkf=0&sep=0&widget_number=21000&lcid=SNXX0006,USNY0996,UKXX0085,ASXX0112,HKXX0001\"><\/script>');
  };

</script>

我尝试使用上面的代码，但它也不起作用

它仅显示宽度数字，但append函数不执行任何操作

“ asd”是div的ID

还有其他解决方案吗？

Answer 1

只能设置脚本标签的SRC属性一次。 您已经以编程方式附加了新的脚本标签。

查看此答案更改<script>的“ src”属性

Answer 2

该解决方案如何：

<div id="container" style="margin: 15px 0px 0px; display: inline-block; text-align: center;">
    <script id="world" type="text/javascript" src="<your src>"></script>
</div>





var w = window.innerWidth;
  $("#demo").html("Width: " + w);
  $("#world").remove();
  if (w > 991) {
      $('#container').append('<script id="world" type="text/javascript" src="<your src>"></script>');
  }
  else if (w < 991) {
      $('#container').append('<script id="world" type="text/javascript" src="<your src>"></script>');
  };