Javascript onload in HTML

Question

I want to ask a question about the Javascript’s onload.

I’m writing a JSP page with the code <%@ include file ="body.jsp". The included body.jsp contains:

<table onload="function()">

This should load the javascript function, but it doesn't appear to have any effect on the page. Is onload only usable on the body tag?

gblazex · Accepted Answer · 2016-01-12T10:54:51.790

45

Onload can only be used for <body>, <img>, <script>, <iframe> tags, because it tells you when an external resource (image, script, frame) or the whole page (body) has been loaded

Since HTML5 these can also fire a load event: <link>, <style>, <input type=image>, <object>
Support for these can still be a hit or miss though (e.g. older Android browsers)

edited Jan 12 '16 at 10:54

answered Oct 06 '10 at 07:17

gblazex

49,155
12
98
91

and ` – Andrey Jan 10 '16 at 02:21

Marko · Answer 2 · 2013-05-08T22:41:58.243

15

Why not just include it via a <script tag>?

Inside your .jsp file

<script>
    window.onload = function() {
        alert("Hello!");
    }
    // or to execute some function
    window.onload = myFunction; //notice no parenthesis
</script>

edited May 08 '13 at 22:41

answered Oct 06 '10 at 07:32

Marko

71,361
28
124
158

score 3 · Answer 3 · answered Oct 06 '10 at 07:27

As the other guys already stated the onLoad event will not fire on a table. What you can do ist attaching the onLoad-handler to the body element (which will then fire, when the page is loaded) and manipulate the table by for example assigning an id to the table.

<body onload="function() { var table = document.getElementById("table-id"); ... }">
    <table id="table-id"></table>
</body>

Are you using some javascript framework?

Thariama · Answer 4 · 2010-10-06T07:39:39.270

2

"onLoad" may be used on body- and frameset-tags. To see some action you may use:

<body onload="function(){alert('This is an action!')}">

edited Oct 06 '10 at 07:39

answered Oct 06 '10 at 07:18

Thariama

50,002
13
138
166

score 0 · Answer 5 · answered Jan 10 '16 at 07:20

The easiest way i find is to use an external javascript file and jquery.

// Variables and functions you want to declare 
var socket = io.connect();
// .....

// Function you want to run on load
$(function() {
    $('#submit').click(function() {addUser();});
    // ... any other functions you want to run on load
});

This is a code snippet from something that i was working on. The variable is declared before the code runs (It creates a web socket). Then there is the jquery document selector ($) which runs on load and calls the init function to modify my html. I use it to call an anonymous function which runs right away.

This is so out of context. I dont know what to say. – kiltek Oct 29 '18 at 14:15 — kiltek, Oct 29 '18 at 14:15

score 0 · Answer 6 · answered Jul 16 '18 at 22:41

You can throw a <script> tag right after your table with code. Once it gets to the script tag it would mean that the DOM for the table element above it has been loaded and can now be accessed in your script below it.

Note: The following below isn't applicable to the question but rather the other answers being given.

I recommend using the addEventListener function in javascript for adding the event. This makes sure that you are not overwriting or going to be overwritten by anyone else wanting to listen to the event.

Example

var iframe = document.getElementsByTagName('iframe')[0];
iframe.addEventListener('load', function(event){ console.log("iframe Loaded", event); })

Javascript onload in HTML

6 Answers6

Example

Linked