admin管理员组文章数量:1406924
I have searched but wasn't able to find what i am looking for. I have one js file that will have multiple href links in it:
var link1=""
var link2=""
var link3=""
etc.... will be many variables
In my html file I would like to be able to call one or more of those link into an href.
<a href="link1">my first link</a>
<a href="link3">random link</a>
My question is , how can I pass one or more of these variables over to my html file?
UPDATE: Ok, here is my code with the snippet that Tugca supplied... I know that Im going to be missing something dumb on my part.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Local Hotels</title>
<link rel="stylesheet" href="HotelStyleSheet.css" />
<script>
var link1 = "";
var link2 = "";
document.getElementById("link_1").href = link1;
document.getElementById("link_2").href = link2;
</script>
</head>
<body onload=resizeTo(480,270)>
<div class="list">
<div class="hotel"> <a id="link_1">My first link</a>
</div>
<div class="list">
<div class="hotel"><a id="link_2">The second link</a>
</div>
</div>
</body>I have searched but wasn't able to find what i am looking for. I have one js file that will have multiple href links in it:
var link1="http://somelink."
var link2="http://another."
var link3="http://morelinks."
etc.... will be many variables
In my html file I would like to be able to call one or more of those link into an href.
<a href="link1">my first link</a>
<a href="link3">random link</a>
My question is , how can I pass one or more of these variables over to my html file?
UPDATE: Ok, here is my code with the snippet that Tugca supplied... I know that Im going to be missing something dumb on my part.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Local Hotels</title>
<link rel="stylesheet" href="HotelStyleSheet.css" />
<script>
var link1 = "http://firstwebsite.";
var link2 = "http://anotherwebsite.";
document.getElementById("link_1").href = link1;
document.getElementById("link_2").href = link2;
</script>
</head>
<body onload=resizeTo(480,270)>
<div class="list">
<div class="hotel"> <a id="link_1">My first link</a>
</div>
<div class="list">
<div class="hotel"><a id="link_2">The second link</a>
</div>
</div>
</body>- 2 HTML does not have variables, so you cant pass anything. you can only use the javascript to render HTML and append it to the document. – NDM Commented Jan 23, 2017 at 12:22
- Would you like to populate the html links at page load or dynamically at some point after the page loads? – nicktendo Commented Jan 23, 2017 at 12:23
-
So you want to replace
hrefwith their corresponding variables in JavaScript scope? – Adam Azad Commented Jan 23, 2017 at 12:23 - 7 Possible duplicate of How can I add "href" attribute to a link dynamically using JavaScript? – Rajesh Commented Jan 23, 2017 at 12:23
- @nicktendo - Populating at page load would be perfect. Once the links are setup, they wouldn't be changing so dynamic really wouldn't be necessary (at least I don't think so) – Wayne Commented Jan 23, 2017 at 12:35
2 Answers
Reset to default 2You can't pass variable form JavaScript to HTML. In normal work-flow, HTML will be rendered before being unaware of JavaScript. But you can modify HTML (or DOM elements). This is why we're using JavaScript.
var link1 = "http://stackoveflow./";
document.getElementById("link_1").href = link1;
document.getElementById("link_2").href = 'http://stackoverflow./questions';<a id="link_1">my first link</a>
<a id="link_2">random link</a>you can create anchor tags dynamically using js
var mydiv = document.getElementById("myDiv");
var aTag = document.createElement('a');
aTag.setAttribute('href',"yourlink.htm");
aTag.innerHTML = "link text";
mydiv.appendChild(aTag);
see this question for reference..
本文标签： javascriptpassing var from js to htmlStack Overflow
版权声明：本文标题：javascript - passing var from js to html - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744973785a2635395.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论