Why is the JavaScript variable value not displaying?

Question

I am trying to practice JavaScript and I wanted to output the variable in a created element. But the value stored in the variable is not output. Only the word answer. I console logged the variable and it has a number value in it. But it does not display only the word I do not know why?

var name, computer, age, answer;

name = window.prompt("What is your name?");
alert("you chose " + name);

computer = window.prompt("How old where you when you used a computer");
alert(computer + "  0.0");

age = window.prompt("How old are you now?");
alert("you are " + age);

if (age - computer < 0) {
  age = 0;
  computer = 0;
}

answer = age - computer;

var con = document.getElementById('container');
var h1 = document.createElement('h1');
var h1Text = document.createTextNode('answer');
h1.appendChild('h1Text');
con.appendChild('h1');

// document.write(age + " - " + computer + " = ");
// document.write(answer + "<br>");

body {
  background-color: orange;
}

div {
  background-color: green;
  max-width: 960px;
  margin: 3em auto;
}

<div id="container"></div>

instead of creating a text node, can't you edit the innerText property of the h1 tag? — Gab
– Gab, Commented Jan 20, 2018 at 18:05
I suggest you look at the JavaScript console. Your script causes an error. You should start there in figuring out how to fix your program. — Code-Apprentice
– Code-Apprentice, Commented Jan 20, 2018 at 18:09
var h1Text = document.createTextNode('answer'); h1.appendChild('h1Text'); con.appendChild('h1'); -> var h1Text = document.createTextNode(answer); h1.appendChild(h1Text); con.appendChild(h1); — Patrick Roberts
– Patrick Roberts, Commented Jan 20, 2018 at 18:09

Shubham Khatri · Accepted Answer · 2018-01-20 18:08:00Z

You are passing the string answer instead of the variable answer to createTextNode and hence answer text is being displayed, also h1 and h1Text needs to be variable in

h1.appendChild(h1Text);
con.appendChild(h1);

Working snippet

var name, computer, age, answer;

name = window.prompt("What is your name?");
alert("you chose " + name);

computer = window.prompt("How old where you when you used a computer");
alert(computer + "  0.0");

age = window.prompt("How old are you now?");
alert("you are " + age);

if (age - computer < 0) {
  age = 0;
  computer = 0;
}

answer = age - computer;

var con = document.getElementById('container');
var h1 = document.createElement('h1');
var h1Text = document.createTextNode(answer);
h1.appendChild(h1Text);
con.appendChild(h1);

// document.write(age + " - " + computer + " = ");
// document.write(answer + "<br>");

body {
  background-color: orange;
}

div {
  background-color: green;
  max-width: 960px;
  margin: 3em auto;
}

<div id="container"></div>

sebastianf182 · Accepted Answer · 2018-01-20 18:08:13Z

-1

It is because you are not assigning the variable answer to anything.

Try

h1Text.innerHTML = answer;

answered Jan 20, 2018 at 18:08

sebastianf182

9,9783 gold badges38 silver badges67 bronze badges

Collectives™ on Stack Overflow

Why is the JavaScript variable value not displaying?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related