quick javascript question

[iLostMyXbox21]

okay so i have a script like this

 

**list using A href="#" for nav bar**
<p id="lineone"></p>
<p id="linetwo"></p>
<p id="linethree"></p>
for javascript, i have it set up like

function navbarone() {
 document.getElementById('lineone').innerHTML = 
}

basically i want it to change what <p id="lineone"></p> says when you press it

 

while i could do 

document.getElementById('lineone').innerHTML = 'text here';

i want it to set the text to an <a href=“#”> button (for a menu kind of style)

 

for those is who are curious here is my script https://www.w3schools.com/code/tryit.asp?filename=G1QG7QTFT0HK

[iLostMyXbox21]

if you couldn’t tell, it’s going to be based off of minecraft (but it’s text only)

[MrMG]

You could just set the text of the paragraphs to the Link you want them to become. Like this: https://www.w3schools.com/code/tryit.asp?filename=G1QHJ45BAS87

Just press the Home button and the text will change to a link.

Note that I added a \ character in front of the " symbols in the text to which i set the paragraph. This is important, don't forget this part.

 

Edit: I am not an expert. I don't know anything about how recommended this is or if this works on every browser or if this could lead to any bugs. It's just a quick way I found to make it work.

Edited March 4, 2019 by MrMG
Some extra information added

[iLostMyXbox21]

2 minutes ago, MrMG said:

You could just set the text of the paragraphs to the Link you want them to become. Like this: https://www.w3schools.com/code/tryit.asp?filename=G1QHJ45BAS87

Just press the Home button and the text will change to a link.

Note that I added a \ character in front of the " symbols in the text to which i set the paragraph. This is important, don't forget this part.

this is exactly what i wanted thank you so much

[mariushm]

You could go a step further and do something like this (in the code above) :

 

<script>
  function showmain() {
    par = document.getElementById('lineone');
    link = document.createElement('a');
    link.setAttribute('href','http://google.com');
    link.setAttribute('id','linkid');
    link.innerHTML = 'link to google';
    par.appendChild(link);
    // maybe clear the previous link or innerHTML before appending if you want to reuse that paragraph
    //document.getElementById('lineone').innerHTML = "<a href=\"#\" onClick=\"showmain()\">Home</a>";
  }
</script>

 

[iLostMyXbox21]

@mariushm

where did i go wrong?

Spoiler

function showmain() {
    document.getElementById('lineone').innerHTML = "<a href=\"#\" onClick=\"showmain()\">Home</a>";
    document.getElementById('linetwo').innerHTML = "<a href=\"#\" onClick=\"showmain()\">Home</a>";
    document.getElementById('linethree').innerHTML = "<a href=\"#\" onClick=\"showmain()\">Home</a>";
  }

it’s not working

 

edit: the embed tags were not showing up so i had to use a spoiler

[mariushm]

Click run every time you make changes on that page.

If you use Firefox, press Ctrl+Shift+I  or Tools > Web Developer > Toggle Tools  and you'll see javascript errors reported after you click on Run or the Home button.

 

As you pasted, the code should be correct. Always keep in mind that it's case sensitive, if you type Get instead of get or ID instead of Id the code may not work, those are very common mistakes.

[iLostMyXbox21]

6 minutes ago, mariushm said:

Click run every time you make changes on that page.

If you use Firefox, press Ctrl+Shift+I  or Tools > Web Developer > Toggle Tools  and you'll see javascript errors reported after you click on Run or the Home button.

 

As you pasted, the code should be correct. Always keep in mind that it's case sensitive, if you type Get instead of get or ID instead of Id the code may not work, those are very common mistakes.

yeah i figured out the problem, now it works. thank you so much. i’ll be sure to credit you for the help (since i legit would not be able to continue without that line) lol