I am calling a JavaScript function from the HTML Body using the onload event. The JavaScript function executes successfully but the HTML Body contents are not displayed.
I believe, there is an issue with returning from the JavaScript to the HTML Body.
Here is how the code looks like:
<html>
<script type="text/javascript">
function display()
{
document.write("You just executed JavaScript code");
return true;
}
</script>
<body onload="display();">
<p>We are in HTML now</p>
</body>
</html>
This will display the text, "You just executed JavaScript code" in the browser. But the innerHTML of tags is not displayed.
I modified the onload event in tag as:
<body onload="return display();">
And, even this executes only the JavaScript.
I am calling a JavaScript function from the HTML Body using the onload event. The JavaScript function executes successfully but the HTML Body contents are not displayed.
I believe, there is an issue with returning from the JavaScript to the HTML Body.
Here is how the code looks like:
<html>
<script type="text/javascript">
function display()
{
document.write("You just executed JavaScript code");
return true;
}
</script>
<body onload="display();">
<p>We are in HTML now</p>
</body>
</html>
This will display the text, "You just executed JavaScript code" in the browser. But the innerHTML of tags is not displayed.
I modified the onload event in tag as:
<body onload="return display();">
And, even this executes only the JavaScript.
Share Improve this question asked Jul 11, 2012 at 5:44 Neon FlashNeon Flash 3,24312 gold badges65 silver badges102 bronze badges 4- Is this only for test ? or you are working on some issue where this require ? – Sunny Commented Jul 11, 2012 at 5:58
- Yes it is something which I would like to know how to do. – Neon Flash Commented Jul 11, 2012 at 6:00
- check my answer this is the problem generated by Document.Write().Is this link helpful for you ? – Sunny Commented Jul 11, 2012 at 6:18
- Thank you Sunny and everyone else. Yes, these are helpful and I am reading to understand it better. – Neon Flash Commented Jul 11, 2012 at 8:44
5 Answers
Reset to default 4If you just want to show the message as alert try this.
<script type="text/javascript">
function display()
{
alert("You just executed JavaScript code");
return true;
}
</script>
</head>
<html>
<body onload="display();">
<p>We are in HTML now</p>
</body>
else
<script type="text/javascript">
window.onload=function()
{
document.getElementById("js").innerHTML = "You just executed JavaScript code";
return true;
}
</script>
<body>
<p id="js"></p>
<p>We are in HTML now</p>
</body>
</html>
As per https://developer.mozilla/en/document.write
Once the document has finished loading, calling document.write()
will actually first call document.open()
, which replaces the currently loaded document with a new Document object. So what you're doing with your code is replacing the original document with one that only contains the string 'You just executed javascript code'.
So if you want to use document.write
to place text inline, you would have to use it like so:
<html>
<body>
<p>We are in HTML now</p>
<script>
document.write('You just executed javascript code');
</script>
</body>
</html>
If you want to insert text into the document after it has finished loading, you'll need to use another method, like innerHTML
.
Document.write is replacing the contents inside your body tag.
Try something like this.
<html>
<script type="text/javascript">
function display()
{
document.getElementById("text-from-js").innerHTML = "You just executed JavaScript code";
return true;
}
</script>
<body onload="display();">
<p>We are in HTML now</p>
<p id="text-from-js"></p>
</body>
</html>
As the previous answers said. document.write
cannot be used for your purpose. And I strongly
remend that you don't use it anywhere. Its a bad practice.
For your purpose prepending/appending to document.body.innerHTML
ex: document.body.innerHTML += 'You just executed javascript code';
or something like
document.body.appendChild(document.createTextNode('You just executed javascript code'))
should do.
Hi Neon Flash, I have done some work on your problem.I also research about where is the problem then i found some interesting points hope this will help you Check here
or you can use
Usually, instead of doing
document.write
someElement.innerHTML
document.createElement with an someElement.appendChild.
You can also consider using a library like jQuery and using the modification functions in there: http://api.jquery./category/manipulation/