如何在<a href> html标记内插入javascript变量?

时间:2019-11-08 03:15:47

标签: javascript html

我想在html链接中插入一个javascript变量,以便每次更改变量的值时,它都会在html链接中立即更改。

我已经尝试了很多可能性,但是没有成功。我的代码如下:

<head>
  <title>Hello World</title>
</head>
<body>

CATEGORIE NAME: <input id="first_name">
DEVICE NAME: <input id="last_name">
<button id="say">Send!</button>

<hr>
<div id="result"></div>

<script>
function say_hi() {
    var fname = document.getElementById('first_name').value;
    var lname = document.getElementById('last_name').value;

    var html = 'CODE: <b>' + fname  + lname;

    document.getElementById('result').innerHTML = html;
}

document.getElementById('say').addEventListener('click', say_hi);


</script>
    <a href="http://barcodes4.me/barcode/c39/ +$html.png">Click this link</a>

</body>
</html>

请问我该怎么做,以便每次链接直接获取变量“ html”的值并将其添加为链接的一部分

1 个答案:

答案 0 :(得分:1)

DOM API非常简单。它遵循与HTML几乎完全相同的约定。例如,href标记的a属性是href对象的a属性。

您需要做的是使您的a标签更容易找到:

<a id="this_link" href="">Click this link</a>

现在,您只需在脚本中执行以下操作即可:

var link = document.getElementById('this_link');
link.href = "http://barcodes4.me/barcode/c39/" + html + ".png"