Using script variables in html body

Question

I want to call the variable from the script to body. Here is my script code. I want to take the rightanswers and wronganswers values to use in html body.

GetFeedback = function (a) {
    if (a == CorrectAnswer) {
        rightanswers++;
    } else {
        wronganswers++;
    }
    lock = true;
}

where is the HTML ? In what kind of elements do you want the values ? — Riju Mahna
– Riju Mahna, Commented Jan 23, 2013 at 12:49
I can't define the variables because I am a newbie and trying to find its way:( They can be defined as string. — user1942359
– user1942359, Commented Jan 23, 2013 at 12:51
First you probably want to actually close the function and I'm supposing declare GetFeedback (which should be getFeedback as it's not a constructor) with var. (And I'm going to just assume all of the other variables are declared). It sounds like you're looking for some form of HTML interpolation which doesn't exist. The closes would be document.write calls which are ugly. — Matt Whipple
– Matt Whipple, Commented Jan 23, 2013 at 12:51

limoragni · Accepted Answer · 2013-01-23 14:30:23Z

1

You need to use the Document Object Modle. You have different methods with JavaScript to create and insert elements into the DOM. As for example:

var element = document.createElement('p');
var body = document.body;
body.appendChild(element);

With that code you are creating an element, then appendig it into the body. And that is pure JavaScript. You could use Mootools or jQuery, and It is goign to be simpler. But JavaScript doesn't work like PHP for example, where you can use the variables mixed up with the HTML.

And if you want to trigger the function from the HTML you need to bind thtat function to an event. For example clicking on a link would be.

HTML

<a href="#" id="button"> Click Here </a>

JS

var b = document.getElementById('button');
b.click = function(){
   GetFeedback();
}

edited Jan 23, 2013 at 14:30

answered Jan 23, 2013 at 12:53

limoragni

2,7762 gold badges34 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mathew Thompson · Accepted Answer · 2013-01-23 12:51:55Z

0

Make sure you're declaring the variable (we can't see that in the code provided) by using var:

<script>
    var GetFeedback = function (a) {
        if (a == CorrectAnswer) {
            rightanswers++;

        } else {
            wronganswers++;
        }
        lock = true;
</script>

Then in your HTML, you can use feedback like this (although, it's not good practice to use the below, it's merely for demonstration purposes):

<a href="#" onclick="javascript:GetFeedback();">Hello</a>

answered Jan 23, 2013 at 12:51

Mathew Thompson

56.5k15 gold badges131 silver badges151 bronze badges

Comments

Jimmery · Accepted Answer · 2013-01-24 12:14:49Z

0

you can use jquery to change the html on the page.

GetFeedback = function(a){
    if(a==CorrectAnswer){
        rightanswers++;
    }else{
        wronganswers++;
    }
    lock=true;
    $('p:first').html('Right Answers: '+rightanswers+' <br> Wrong Answers: '+wronganswers);
};

and have this as your html

<body>
<p></p>
<a href="javascript:GetFeedback(a);">Get Feedback</a>
</body>

edited Jan 24, 2013 at 12:14

answered Jan 23, 2013 at 12:51

Jimmery

10.2k25 gold badges90 silver badges166 bronze badges

2 Comments

user1942359 Over a year ago

after $('p:first').html('Right Answers: '+rightanswers+' <br> Wrong Answers: '+wronganswers); what do I need to write in body? such as var rightans = ...

Jimmery Over a year ago

see my update - the $('p:first') line will output your script variables into the first paragraph tag on the page. you will need to use the jQuery library to make this work (but then jQuery makes writing javascript much easier - Id highly recommend it even for beginners).

Collectives™ on Stack Overflow

Using script variables in html body

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related