声明一个变量并在 html 中使用它

Question

我有很大的 html 文档，其中包含带有 href 和 src 的各种图像。

我想声明它们的 href 和 src 以便仅更改它们的 var 值。像...

<script>
var imagehref = www.url.com; 
var imagesrc = www.url.com/img.pg; 
</script>

HTML Part:

<html>
<a href=imagehref><img src=imagesrc /> </a>
</html>

正确的syntax/way怎么做？

Answer 1

给锚标签添加标识符，然后使用setAttribute设置href和src

var imagehref = 'www.url.com';
var imagesrc = 'www.url.com/img.pg';

let anchor = document.getElementById('test');
anchor.setAttribute('href', imagehref);
anchor.querySelector('img').setAttribute('src', imagesrc)

<a id='test' href=''><img src='' /></a>

Answer 2

const imagehref = "https://google.com"; 
const imagesrc = "https://media3.giphy.com/media/sIIhZliB2McAo/giphy.gif"; 

function update(className, property, value) {
  Array.from(document.getElementsByClassName(className)).forEach(elem => (elem[property] = value)) 
}

update("imagehref", "href", imagehref)
update("imagesrc", "src", imagesrc)

<a class="imagehref"><img class="imagesrc" /> </a>
<a class="imagehref"><img class="imagesrc" /> </a>
<a class="imagehref"><img class="imagesrc" /> </a>

Answer 3

这种方式不行，必须直接在js脚本中设置href和src。这是一个例子：

<html>
  <body>
    <a id="dynamicLink" href=""><img id="dynamicImg" src="" /> </a>
  </body>
  <script>
    var link = document.getElementById('dynamicLink'); 
    link.href = "http://www.url.com"
    var img = document.getElementById('dynamicImg'); 
    img.src = "http://www.url.com/img.png"
  </script>
</html>

声明一个变量并在 html 中使用它

Declare a variable and use it in html

html

javascript

variables

var