Question

I am somewhat new to web developing, so I am trying to learn along the way. I have a div that is 500 x 500. Inside of that div I have two divs that are each 250×500. So my outer div is filled up with the two inner divs.

I have it setup so that when I click on the first div (the left one) a JavaScript is called, and a prompt pop up box asks for a website URL which is then stored inside of a string variable.

How can I make it so that the second div (the right one) takes the string variable from the alert box from the left div and puts it into an a href tag so that I can link to the website from the right div?

Can a a href tag accept a value from a variable for its link? Maybe I am going about this all wrong, is there a better way I should be approaching this? Any help is appreciated!

Answer 1

There’s the DOM creation method:

// Create an element
var aEl = document.createElement("a");

// Ask the user for the URL
aEl.href = prompt("Please enter the website URL");

// Determine whether to use innerText or textContent
if ("innerText" in aEl)
    aEl.innerText = aEl.href;
else
    aEl.textContent = aEl.href;

// Add the link to the right div
document.getElementById("rightDiv").appendChild(a);

Or the straight-up innerHTML method:

var url = prompt("Please enter the website URL");
document.getElementById('rightDiv').innerHTML = '<a href="'+url+'">'+url+'</a>';