Why isn't my function running on document load as expected?
40,346
Solution 1
Don't use document.onload
use window.onload
instead.
See http://jsfiddle.net/mowglisanu/r6NzE/
Solution 2
you can use this:
function setGround() {
document.getElementById('content').style.height = '40px';
}
document.onload = setGround;
but if you want see changes, you should create border on section tag by use this:
<section id="content" style='border:1px solid fuchsia;' >
<p>sf </p>
</section>
Solution 3
You should use
window.onLoad = setGround;
instead of
document.onload = setGround;
Author by
cmplieger
Updated on March 22, 2020Comments
-
cmplieger about 4 years
This code should set an elements height; however no style gets added. Am I missing something obvious?
function setGround() { document.getElementById('content').style.height = '40px'; } document.onload = setGround;
The HTML is quite basic:
<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Template</title> <link rel="stylesheet" type="text/css" href="css/default.css"/> <link rel="stylesheet" type="text/css" href="css/orange.css"/> <script type="text/javascript" src="javascript/detect-css.js"></script> </head> <body> <header> <div id="logo"></div> </header> <section id="sidebar"><p>sf </p> </section> <section id="content"><p>sf </p> </section> </body> </html>
Thank you for your help!