How do I use a JavaScript variable in a href?

javascript html variables hyperlink

14,465

Solution 1

This should be what you need.

var link = "http://www.google.com/";
var a = document.getElementById('yourlinkId');
a.href = link;

Solution 2

Update the href value via javascript. Using something like jQuery it is as simple as:

var link = "www.google.com";
$("a").attr("href", link);

14,465

Author by

BRAINBUZZ media

Updated on June 05, 2022

Comments

BRAINBUZZ media almost 2 years

I have a JavaScript variable I grabbed from a form field and I am trying to use it for the href = value in a link. What is the proper way to output this JavaScript variable in HTML?
- brezanac almost 12 years
  
  You should really provide some code.
- david almost 12 years
  
  @holodoc What? Why? His question explains the issue perfectly well.
- brezanac almost 12 years
  
  Because so many things are missing in his description like if he is trying to use inline JavaScript or perform the manipulation after the document (or at least DOM) has been loaded, is he using a framework or pure JavaScript, did he even try something before posting etc. etc. etc.
- Admin almost 12 years
  
  I agree with @holodoc. OP should show what they've tried. Can't tell what the actual issue is right now,
- Charlie almost 12 years
  
  The issue is that he doesn't know how to do it.
- Admin almost 12 years
  
  @Charlie: Which part? You're saying he doesn't know how to do any of it?
- david almost 12 years
  
  @holodoc All those things that you say are 'missing' are completely irrelevant to his question.
- brezanac almost 12 years
  
  @david Good for you. Unfortunately I don't know how to use a crystal ball ;)
- Admin almost 12 years
  
  @david: Every one of those things is relevant, and could be a point of failure.
- david almost 12 years
  
  @amnotiam That's retarded. Another point of failure could be that he has no computer at all! Or maybe his keyboard isn't plugged in. That could stop him from getting the code working. Instead of trying to include all edge cases just look at the question as asked, and answer it. If the answer doesn't work, only then should you ask for more information. The more specifics you force the asker to list the less likely it is to be relevant to other users in the future.
- Admin almost 12 years
  
  @david: Don't be obtuse. I've answered a lot more questions than you have on StackOverflow, and have seen plenty of times where OP excluded relevant code, only to discover when it was finally included that everything was correct but for a single important and very relevant detail. Instead of giving foolish examples as though they had comparable merit, you should encourage OP to provide detailed information.
- BRAINBUZZ media almost 12 years
  
  Sorry, I had no code as I just had no idea how to do this. I'm trying to work with the answers given now.
brezanac almost 12 years

document.write() is nothing but trouble.
Admin almost 12 years

Only if there's a relatively located document named www.google.com.
Admin almost 12 years

jQuery answers are irrelevant if OP isn't using it. And you're assuming there's a local document named www.google.com.
Gregg almost 12 years

I am answering a question. If the OP doesn't like it he can choose to not mark it as the answer. Regarding the variable I created, that was to mimic whatever variable he might have grabbed from his form element.
Admin almost 12 years

The value of the variable can be misleading to someone inexperienced, as can using non-native and likely irrelevant syntax.
Gregg almost 12 years

Then feel free to provide your own answer.