HTML属性中的Javascript变量

Question

我知道有很多关于此的帖子，但我无法找到我的具体问题的答案。

我想将JS变量设为HTML属性的值

<script> var screenWidth = screen.width </script> 

<img src="images/title.png" width="VARIABLE HERE" style="margin-top: 3%"`

VARIABLE HERE是我想要screenWidth变量的地方。有什么好处呢？

谢谢， 本

Answer 1

这应该有效：

<script>var screenWidth = screen.width;</script> 
...
<img src="images/title.png" onload="this.width=screenWidth;" style="margin-top: 3%">

Answer 2

为标记添加ID。

即。 <img id="xxxx" ...>

然后使用

 document.getElementById('xxx').setAttribute('width', 'somevalue')

请参阅setAttribute

或者使用JQuery作为另一张海报

Answer 3

您可以使用javascript将样式添加到这样的特定元素。

<强>脚本

document.getElementById('myImg').style.width = screen.width + "px";

<强> HTML

<img id="myImg" src="images/title.png"  style="margin-top: 3%">

这是 demo

Answer 4

您无法在HTML中调用JavaScript变量。您需要使用JavaScript或JQuery编写它。你可以这样做： -

 <input id="myInput" .../>
 <script>
    var myVar = "value";
    $("#myInput").attr("name", myVar);
 </script>

Answer 5

在这种情况下，您可以使用CSS将宽度设置为100vw之一（可能通过style属性：style="width: 100vw;"。这效率更高且可读性更好，但isn't supported in some old browsers。 / p>

Answer 6

大约一年半前我回答了这个问题，我意识到这可能会使页面滞后，所以不要这样做！

如果您希望在变量值更改时更新属性，请尝试将do{variableold=variable} while(variable!==variableold)之后的上述JavaScript放在永久循环（while(1)）中。

while(1){
    do{
        variableold=variable
    } while(variable!==variableold);
    //code
}