73

I am looking for a way to call a javascript number in the body of an html page. This does not have to be long and extravagant just simply work, I just want something like:

<html>
<head>
<script type="text/javscript">
var number = 123;
</script>
</head>

<body>
<h1>"the value for number is: " + number</h1>
</body>
</html>
2
  • 1
    you need to assign with <span> tag and from javascript id attribute to set value Commented Nov 29, 2016 at 5:38
  • 2
    Please check this link:-stackoverflow.com/questions/30426969/… Commented Nov 29, 2016 at 5:42

10 Answers 10

83

Try This...

<html>

<head>
  <script>
    function myFunction() {
      var number = "123";
      document.getElementById("myText").innerHTML = number;
    }
  </script>
</head>

<body onload="myFunction()">

  <h1>"The value for number is: " <span id="myText"></span></h1>

</body>

</html>

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

Comments

55

Use document.write().

<html>
<head>
  <script type="text/javascript">
    var number = 123;
  </script>
</head>

<body>
    <h1>
      the value for number is:
      <script type="text/javascript">
        document.write(number)
      </script>
    </h1>
</body>
</html>

Comments

5
<html>
<head>
<script type="text/javascript">
var number = 123;
var string = "abcd";

function docWrite(variable) {
    document.write(variable);
}
</script>
</head>

<body>
<h1>the value for number is: <script>docWrite(number)</script></h1>

<h2>the text is: <script>docWrite(string)</script> </h2>
</body>
</html>

You can shorten document.write but can't avoid <script> tag

Comments

2

Use the document.write() method to dynamically write content to the HTML document.

<h1><script>document.write("the value for number is: " + number)</script></h1>

Make sure that the variable number is declared and has a value before this script is executed.

Comments

1

You can do the same on document ready event like below

<script>
$(document).ready(function(){
 var number = 112;
    $("yourClass/Element/id...").html(number);
// $("yourClass/Element/id...").text(number);
});
</script>

or you can simply do it using document.write(number);.

Comments

1

Here is another way it can be done .

function showData(m)
{
    let x ="<div> added from js ";
    let y = m.toString();
    let z = "</div>";
    let htmlData = x+y+z ;
    content.insertAdjacentHTML("beforeend",htmlData);
}

Comments

0

<script type="text/javascript">
        function get_param(param) {
   var search = window.location.search.substring(1);
   var compareKeyValuePair = function(pair) {
      var key_value = pair.split('=');
      var decodedKey = decodeURIComponent(key_value[0]);
      var decodedValue = decodeURIComponent(key_value[1]);
      if(decodedKey == param) return decodedValue;
      return null;
   };

   var comparisonResult = null;

   if(search.indexOf('&') > -1) {
      var params = search.split('&');
      for(var i = 0; i < params.length; i++) {
         comparisonResult = compareKeyValuePair(params[i]); 
         if(comparisonResult !== null) {
            break;
         }
      }
   } else {
      comparisonResult = compareKeyValuePair(search);
   }

   return comparisonResult;
}

var parcelNumber = get_param('parcelNumber'); //abc
var registryId  = get_param('registryId'); //abc
var registrySectionId = get_param('registrySectionId'); //abc
var apartmentNumber = get_param('apartmentNumber'); //abc

        
    </script>

then in the page i call the values like so:

 <td class="tinfodd"> <script  type="text/javascript">
                                                    document.write(registrySectionId)
                                                    </script></td>

Comments

-1

Index.html:

<html>
<body>
    Javascript Version: <b id="version"></b>
    <script src="app.js"></script>
</body>
</html>

app.js:

var ver="1.1";
document.getElementById("version").innerHTML = ver;

Comments

-1
<?php
$x1='<span id="x1"></span><script>document.getElementById("x1").innerHTML = x1;</script>';
$x2='<span id="x2"></span><script>document.getElementById("x2").innerHTML = x2;</script>';
$x3='<span id="x3"</span><script>document.getElementById("x3").innerHTML = x3;</script>';
?>

<html><body>
<script> var 
  x1="123",
  x2="ABC", 
  x3=666; 
</script>
<?php echo $x1 ?><br>
<?php echo $x2 ?><be>
<?php echo $x3 ?><be>
</body></html>

1 Comment

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.
-4

You cannot add JavaScript variable to HTML code.

For this you need to do in following way.

<html>
<head>
<script type="text/javscript">
var number = 123;

document.addEventListener('DOMContentLoaded', function() {
   document.getElementByTagName("h1").innerHTML("the value for number is: " + number);
});
</script>
</head>
<body>
<h1></h1>
</body>
</html>

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.